reorganizing the draft

Author: howcom

css3-values/Overview.src.html

@@ -653,60 +653,6 @@ <h3>&lt;color&gt;</h3>
 </div>
 
 
-<h3>&lt;fraction&gt;</h3>
-
-<p>Some properties accept a series of length values that, in sum,
-should add up to a certain length. To take up any remaining space,
-fractions can be used. 
-
-<h4>The 'fr' unit</h4>
-
-<p>The <dfn title="fr (unit)">fr</dfn> unit is used to
-distribute any remaining space in a series of length values. If
-multiple fractions are specified, they take up space proportionally to
-their numeric value.
-
-<div class="example">
-<pre>
-border-parts: 10px 1fr 10px;
-border-parts: 10px 1fr 10px 1fr 10px;
-border-parts: 10px 2fr 10px 2fr 10px;
-</pre>
-</div>
-
-<p>The ''fr'' unit can only be used in combination with regular length units.
-
-
-<h3>&lt;grid&gt;</h3>
-
-<p>A grid is a set of invisible vertical and horizontal lines that can
-be used to align content. In CSS3, a grid lines can be established
-implicitly or explicitly [[!CSS3COL]] [[!CSS3GRID]]. In any case,
-the distance between grid lines can be referred to by the ''gr'' unit.
-
-
-<h4>The 'gr' unit</h4>
-
-<p>The <dfn title="gr (unit)">gr</dfn> unit is used to position elements in relation to grid
-lines. 
-
-<div class="example">
-<pre>
-img { 
-  float: top left multicol; 
-  float-offset: 2gr; 
-  width: 1gr }
-}
-</pre>
-</div>
-
-<p>Grid lines can be laid out in uneven patterns. Therefore, the ''gr'' unit is not linear. 
-
-<div class="example">
-<p>For example, "2gr" is not necessarily twice as long as "1gr".
-</div>
-
-
 <h3>&lt;percentage&gt;</h4>
 
 <p>The format of a percentage value, denoted by <dfn
@@ -1066,6 +1012,8 @@ <h3>&lt;image&gt;</h3>
 
 <p>TBD.
 
+
+
 <!--
 <h4>The 'counter' function</h4>
 
@@ -1102,6 +1050,60 @@ <h4>The 'counter' function</h4>
 -->
 
 
+<h3>&lt;fraction&gt;</h3>
+
+<p>Some properties accept a series of length values that, in sum,
+should add up to a certain length. To take up any remaining space,
+fractions can be used. 
+
+<h4>The 'fr' unit</h4>
+
+<p>The <dfn title="fr (unit)">fr</dfn> unit is used to
+distribute any remaining space in a series of length values. If
+multiple fractions are specified, they take up space proportionally to
+their numeric value.
+
+<div class="example">
+<pre>
+border-parts: 10px 1fr 10px;
+border-parts: 10px 1fr 10px 1fr 10px;
+border-parts: 10px 2fr 10px 2fr 10px;
+</pre>
+</div>
+
+<p>The ''fr'' unit can only be used in combination with regular length units.
+
+
+<h3>&lt;grid&gt;</h3>
+
+<p>A grid is a set of invisible vertical and horizontal lines that can
+be used to align content. In CSS3, a grid lines can be established
+implicitly or explicitly [[!CSS3COL]] [[!CSS3GRID]]. In any case,
+the distance between grid lines can be referred to by the ''gr'' unit.
+
+
+<h4>The 'gr' unit</h4>
+
+<p>The <dfn title="gr (unit)">gr</dfn> unit is used to position elements in relation to grid
+lines. 
+
+<div class="example">
+<pre>
+img { 
+  float: top left multicol; 
+  float-offset: 2gr; 
+  width: 1gr }
+}
+</pre>
+</div>
+
+<p>Grid lines can be laid out in uneven patterns. Therefore, the ''gr'' unit is not linear. 
+
+<div class="example">
+<p>For example, "2gr" is not necessarily twice as long as "1gr".
+</div>
+
+
 
 <h3>Special cases</h3>