Huh, I never fixed the flex-order value back to <number> and 0. Also, tweaked the example's text.

Author: tabatkins

css3-flexbox/Overview.html

@@ -823,12 +823,12 @@ <h3 id=flex-order><span class=secno>3.2. </span> Display Order: the
     <tr>
      <th>Value:
 
-     <td>&lt;integer>
+     <td>&lt;number>
 
     <tr>
      <th>Initial:
 
-     <td>1
+     <td>0
 
     <tr>
      <th>Applies to:
@@ -864,25 +864,34 @@ <h3 id=flex-order><span class=secno>3.2. </span> Display Order: the
   <div class=example>
    <p>This example shows how ordinal groups might be used.</p>
 
-   <pre><code>	div { display: flexbox; }
-#item1 { flex-order: 2; }
-#item3 { flex-order: 2; }
-#item4 { flex-order: 1; }
+   <pre>
+div { display: flexbox; }
+#item1, #item3 { flex-order: 1; }
+#item4 { flex-order: 0; }
 
 &lt;div>
-	&lt;div id="item1">item1&lt;/div>
-	&lt;div id="item2">item2&lt;/div>
-	&lt;div id="item3">item3&lt;/div>
-	&lt;div id="item4">item4&lt;/div>
-&lt;/div></code></pre>
-
-   <p>The first ordinal group, 1, contains item2 and item4. As item2 does not
-    specify an ordinal group, it will default to 1. The elements will be
-    displayed in document order, so item2 will be displayed before item4. The
-    second ordinal group, 2, contains the remaining two items. The resulting
-    display order will be:</p>
-
-   <pre><code>item2 item4 item1 item3</code></pre>
+	&lt;button id="item1">One&lt;/button>
+	&lt;button id="item2">Two&lt;/button>
+	&lt;button id="item3">Three&lt;/button>
+	&lt;button id="item4">Four&lt;/button>
+&lt;/div></pre>
+
+   <p>Items 2 and 4 are both in ordinal group 0 (item 2 defaults to
+    &lsquo;<code class=css>0</code>&rsquo; because it doesn't specify one
+    explicitly). This is the lowest ordinal group, so they'll be displayed
+    first, and in document order, with Item 2 displayed before Item 4. The
+    remaining items are both in ordinal group 1, so the resulting display
+    order will be:</p>
+
+   <div style="border: medium solid green; display: inline-block;">
+    <button>Two</button>
+
+    <button>Four</button>
+
+    <button>One</button>
+
+    <button>Three</button>
+   </div>
   </div>
 
   <p class=issue>Add a realistic example of tab reordering.
@@ -1790,9 +1799,9 @@ <h2 class=no-num id=property>Property index</h2>
     <tr>
      <th><a class=property href="#flex-order0">flex-order</a>
 
-     <td>&lt;integer>
+     <td>&lt;number>
 
-     <td>1
+     <td>0
 
      <td>flexbox items
 

css3-flexbox/Overview.src.html

@@ -347,10 +347,10 @@ <h3 id='flex-order'>
 			<td><dfn>flex-order</dfn>
 		<tr>
 			<th>Value:
-			<td>&lt;integer>
+			<td>&lt;number>
 		<tr>
 			<th>Initial:
-			<td>1
+			<td>0
 		<tr>
 			<th>Applies to:
 			<td><i>flexbox items</i></td>
@@ -371,21 +371,27 @@ <h3 id='flex-order'>
 
 	<div class=example>
 		<p>This example shows how ordinal groups might be used.</p>
-		<pre><code>	div { display: flexbox; }
-#item1 { flex-order: 2; }
-#item3 { flex-order: 2; }
-#item4 { flex-order: 1; }
+
+		<pre>
+div { display: flexbox; }
+#item1, #item3 { flex-order: 1; }
+#item4 { flex-order: 0; }
 
 &lt;div>
-	&lt;div id="item1">item1&lt;/div>
-	&lt;div id="item2">item2&lt;/div>
-	&lt;div id="item3">item3&lt;/div>
-	&lt;div id="item4">item4&lt;/div>
-&lt;/div></code></pre>
+	&lt;button id="item1">One&lt;/button>
+	&lt;button id="item2">Two&lt;/button>
+	&lt;button id="item3">Three&lt;/button>
+	&lt;button id="item4">Four&lt;/button>
+&lt;/div></pre>
 
-		<p>The first ordinal group, 1, contains item2 and item4. As item2 does not specify an ordinal group, it will default to 1. The elements will be displayed in document order, so item2 will be displayed before item4. The second ordinal group, 2, contains the remaining two items. The resulting display order will be:</p>
+		<p>Items 2 and 4 are both in ordinal group 0 (item 2 defaults to ''0'' because it doesn't specify one explicitly).  This is the lowest ordinal group, so they'll be displayed first, and in document order, with Item 2 displayed before Item 4.  The remaining items are both in ordinal group 1, so the resulting display order will be:</p>
 
-		<pre><code>item2 item4 item1 item3</code></pre>
+		<div style="border: medium solid green; display: inline-block;">
+			<button>Two</button>
+			<button>Four</button>
+			<button>One</button>
+			<button>Three</button>
+		</div>
 	</div>
 
 	<p class='issue'>Add a realistic example of tab reordering.</p>