From: harry <harmanmanchanda182@gmail.com>
Date: Tue, 27 Jun 2017 18:18:01 +0000 (+0530)
Subject: Rearrange the ordering of the content in a correct way!
X-Git-Tag: v6.4.1~9^2^2^2~1
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=98f4e0b9ac0e1063b0a2e9e48fa14c9dfc8c30f6;p=thirdparty%2Ffoundation%2Ffoundation-sites.git

Rearrange the ordering of the content in a correct way!

I messed this in Previous PR but now corrected it!
---

diff --git a/docs/pages/flexbox-utilities.md b/docs/pages/flexbox-utilities.md
index 409896795..a596a5874 100644
--- a/docs/pages/flexbox-utilities.md
+++ b/docs/pages/flexbox-utilities.md
@@ -199,16 +199,6 @@ For children, there are 3 quick helper classes to apply the flex property. These
 - `.flex-child-grow` (flex child that will grow to take up all possible space)
 - `.flex-child-shrink` (flex child that will shrink to minimum possible space)
 
-### Responsive Classes 
-
-<div class="callout alert">
-  <p><strong>Depreciation Notice:</strong> From v6.5.x, we are disabling responsive classes by default. You would be able to re-enable it though, with setting that <code>$flexbox-responsive-breakpoints</code> to <code>true</code> .</p>
-</div>
-
-These vanilla flexbox helper classes also have an optional mobile first responsive classes so that setting a class will apply to the small breakpoint and large unless overridden by a class for a larger breakpoint.. Example: `class="flex-child-shrink large-flex-child-auto"` will be shrink on the small and medium breakpoints and then auto on large. 
-
-These optional responsive classes can be disabled by setting `$flexbox-responsive-breakpoints` to `false`. See [here](#sass-variables)
-
 ```html_example
 <div class="grid-x grid-padding-x">
   <div class="cell small-4 flex-container flex-dir-column">
@@ -222,7 +212,17 @@ These optional responsive classes can be disabled by setting `$flexbox-responsiv
 </div>
 ```
 
-All of these helper classes come in responsive varieties, prefixed with all of your named breakpoints. So you can do things like:
+### Responsive Classes 
+
+<div class="callout alert">
+  <p><strong>Depreciation Notice:</strong> From v6.5.x, we are disabling responsive classes by default. You would be able to re-enable it though, with setting that <code>$flexbox-responsive-breakpoints</code> to <code>true</code> .</p>
+</div>
+
+All of these helper classes come in responsive varieties, prefixed with all of your named breakpoints.
+
+These vanilla flexbox helper classes also have an optional mobile first responsive classes so that setting a class will apply to the small breakpoint and large unless overridden by a class for a larger breakpoint.. Example: `class="flex-child-shrink large-flex-child-auto"` will be shrink on the small and medium breakpoints and then auto on large. 
+
+These optional responsive classes can be disabled by setting `$flexbox-responsive-breakpoints` to `false`. See [here](#sass-variables)
 
 ```html_example
 <div class="grid-x grid-padding-x">