From c2fb64ce37d80f33e03eda0e9a956e910cd1ffd8 Mon Sep 17 00:00:00 2001
From: Luke Frake <lukefrake@gmail.com>
Date: Tue, 3 Oct 2017 02:56:13 +0100
Subject: Add order first to grid (#24202)

* Add first class to grid framework to add negative ordering

* Add order-first explination to the docs
---
 docs/4.0/layout/grid.md | 20 ++++++++++++++++++++
 1 file changed, 20 insertions(+)

(limited to 'docs')

diff --git a/docs/4.0/layout/grid.md b/docs/4.0/layout/grid.md
index 4a1a55e18..a194bd840 100644
--- a/docs/4.0/layout/grid.md
+++ b/docs/4.0/layout/grid.md
@@ -535,6 +535,26 @@ Use `.order-` classes for controlling the **visual order** of your content. Thes
 {% endexample %}
 </div>
 
+There's also a responsive `.order-first` class that quickly changes the order of one element by applying `order: -1`. This class can also be intermixed with the numbered `.order-*` classes as needed.
+
+<div class="bd-example-row">
+{% example html %}
+<div class="container">
+  <div class="row">
+    <div class="col">
+      First, but unordered
+    </div>
+    <div class="col">
+      Second, but unordered
+    </div>
+    <div class="col order-first">
+      Third, but first
+    </div>
+  </div>
+</div>
+{% endexample %}
+</div>
+
 ### Offsetting columns
 
 You can offset grid columns in two ways: our responsive `.offset-` grid classes and our [margin utilities]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/spacing/). Grid classes are sized to match columns while margins are more useful for quick layouts where the width of the offset is variable.
-- 
cgit v1.2.3