diff --git a/docs/source/grid.md b/docs/source/grid.md
index 332f54e31..8852fbd5f 100644
--- a/docs/source/grid.md
+++ b/docs/source/grid.md
@@ -31,7 +31,7 @@ Basic grid example:
 Columns don't need to fill a row:
 
 <div class="bg-light-softer text-medium text-sm mb-6">
-    <div class="text-dark-soft p-4 leading-none">.flex</div>
+    <div class="text-dark-soft p-4 leading-none">.flex.flex-wrap</div>
     <div class="flex flex-wrap">
         <div class="w-full md:w-1/4">
             <div class="text-center py-4 bg-dark-softer text-light">
@@ -55,7 +55,7 @@ Columns don't need to fill a row:
 Columns can be different widths:
 
 <div class="bg-light-softer text-medium text-sm mb-6">
-    <div class="text-dark-soft p-4 leading-none">.flex</div>
+    <div class="text-dark-soft p-4 leading-none">.flex.flex-wrap</div>
     <div class="flex flex-wrap">
         <div class="w-full md:w-1/4">
             <div class="text-center py-4 bg-dark-softer text-light">
@@ -112,27 +112,24 @@ Rows can overflow and wrap:
 Columns can have gutters:
 
 <div class="bg-light-softer text-medium text-sm mb-6">
-    <div class="text-dark-soft p-4 leading-none">.flex.pull-x-4</div>
+    <div class="text-dark-soft p-4 leading-none">.flex.flex-wrap.pull-x-4</div>
     <div class="flex flex-wrap pull-x-4">
-        <div class="flex-none w-full md:w-1/3 px-4">
+        <div class="w-full md:w-1/3 px-4">
             <div class="text-center py-4 bg-dark-softer text-light">
-                <div>.flex-none</div>
                 <div>.w-full</div>
                 <div>.md:w-1/3</div>
                 <div>.px-4</div>
             </div>
         </div>
-        <div class="flex-none w-full md:w-1/3 px-4">
+        <div class="w-full md:w-1/3 px-4">
             <div class="text-center py-4 bg-dark-soft text-light">
-                <div>.flex-none</div>
                 <div>.w-full</div>
                 <div>.md:w-1/3</div>
                 <div>.px-4</div>
             </div>
         </div>
-        <div class="flex-none w-full md:w-1/3 px-4">
+        <div class="w-full md:w-1/3 px-4">
             <div class="text-center py-4 bg-dark-softer text-light">
-                <div>.flex-none</div>
                 <div>.w-full</div>
                 <div>.md:w-1/3</div>
                 <div>.px-4</div>
@@ -145,7 +142,7 @@ Columns can have gutters:
 Column widths can be automatic:
 
 <div class="bg-light-softer text-medium text-sm mb-6">
-    <div class="text-dark-soft p-4 leading-none">.flex</div>
+    <div class="text-dark-soft p-4 leading-none">.flex.flex-wrap</div>
     <div class="flex flex-wrap">
         <div class="w-1/4 md:flex-fill">
             <div class="text-center py-4 bg-dark-softer text-light">
@@ -178,7 +175,7 @@ Column widths can be automatic:
 Fixed width columns are still respected even if a smaller screen has auto column widths:
 
 <div class="bg-light-softer text-medium text-sm mb-6">
-    <div class="text-dark-soft p-4 leading-none">.flex</div>
+    <div class="text-dark-soft p-4 leading-none">.flex.flex-wrap</div>
     <div class="flex flex-wrap">
         <div class="flex-fill md:w-1/6 md:flex-none">
             <div class="text-center py-4 bg-dark-softer text-light">
@@ -222,7 +219,7 @@ Fixed width columns are still respected even if a smaller screen has auto column
 Use margin auto utilities to accomplish offsets:
 
 <div class="bg-light-softer text-medium text-sm mb-6">
-    <div class="text-dark-soft p-4 leading-none">.flex</div>
+    <div class="text-dark-soft p-4 leading-none">.flex.flex-wrap</div>
     <div class="flex flex-wrap">
         <div class="w-full md:w-1/3 md:ml-auto">
             <div class="text-center py-4 bg-dark-soft text-light">