[css-flexbox] Better paragraphing in section 4

--HG--
extra : rebase_source : 5da97322799546312158dfc3dbae550193f5fda8

Author: fantasai

css-flexbox/Overview.bs

@@ -548,26 +548,13 @@ Flex Items</h2>
 		(i.e. characters that can be affected by the 'white-space' property)
 		is not rendered, as if it were ''display:none''.
 
-	<p class="note">
-		Authors reading this spec may want to
-		<a href="#item-margins">skip past these box-generation details</a>.
-
 	<p>
 		A <i>flex item</i> establishes a new formatting context for its contents.
 		The type of this formatting context is determined by its 'display' value, as usual.
-		The computed 'display' of a <i>flex item</i>
-		is determined by applying the table in
-		<a href="http://www.w3.org/TR/CSS2/visuren.html#dis-pos-flo">CSS 2.1 Chapter 9.7</a>
-		(except that internal table boxes are instead handled by anonymous box fixup, see below).
 		However, flex items are flex-level boxes, not block-level boxes:
 		they participate in their container's flex formatting context,
 		not in a block formatting context.
 
-	<p class='note'>
-		The 'display' computation on flex items as defined here
-		is expected to be superseded by a future specification
-		that defines a new 'display' value specific to flex items.
-
 	<div class="example">
 		<p>Examples of flex items:
 		<pre>
@@ -592,6 +579,21 @@ Flex Items</h2>
 &lt;/div></pre>
 	</div>
 
+	<p class="note">
+		Authors reading this spec may want to
+		<a href="#item-margins">skip past the following box-generation details</a>.
+
+	<p>
+		The computed 'display' of a <i>flex item</i>
+		is determined by applying the table in
+		<a href="http://www.w3.org/TR/CSS2/visuren.html#dis-pos-flo">CSS 2.1 Chapter 9.7</a>
+		(except that internal table boxes are instead handled by anonymous box fixup, see below).
+
+	<p class='note'>
+		The 'display' computation on flex items as defined here
+		is expected to be superseded by a future specification
+		that defines a new 'display' value specific to flex items.
+
 	<p>
 		Some values of 'display' trigger the generation of anonymous boxes.
 		For example, a misparented ''table-cell'' child is fixed up

css-flexbox/Overview.html

@@ -694,26 +694,13 @@ <h2 class="heading settled heading" data-level=4 id=flex-items><span class=secno
 		(i.e. characters that can be affected by the <a class=property data-link-type=propdesc href=http://dev.w3.org/csswg/css-text-3/#white-space title=white-space>white-space</a> property)
 		is not rendered, as if it were <a class=css data-link-type=propdesc href=http://www.w3.org/TR/CSS21/visuren.html#propdef-display title=display>display:none</a>.
 
-	<p class=note>
-		Authors reading this spec may want to
-		<a href=#item-margins>skip past these box-generation details</a>.
-
 	<p>
 		A <a data-link-type=dfn href=#flex-item title="flex item">flex item</a> establishes a new formatting context for its contents.
 		The type of this formatting context is determined by its <a class=property data-link-type=propdesc href=http://www.w3.org/TR/CSS21/visuren.html#propdef-display title=display>display</a> value, as usual.
-		The computed <a class=property data-link-type=propdesc href=http://www.w3.org/TR/CSS21/visuren.html#propdef-display title=display>display</a> of a <a data-link-type=dfn href=#flex-item title="flex item">flex item</a>
-		is determined by applying the table in
-		<a href=http://www.w3.org/TR/CSS2/visuren.html#dis-pos-flo>CSS 2.1 Chapter 9.7</a>
-		(except that internal table boxes are instead handled by anonymous box fixup, see below).
 		However, flex items are flex-level boxes, not block-level boxes:
 		they participate in their container’s flex formatting context,
 		not in a block formatting context.
 
-	<p class=note>
-		The <a class=property data-link-type=propdesc href=http://www.w3.org/TR/CSS21/visuren.html#propdef-display title=display>display</a> computation on flex items as defined here
-		is expected to be superseded by a future specification
-		that defines a new <a class=property data-link-type=propdesc href=http://www.w3.org/TR/CSS21/visuren.html#propdef-display title=display>display</a> value specific to flex items.
-
 	<div class=example>
 		<p>Examples of flex items:
 		<pre>&lt;div style="display:flex"&gt;
@@ -736,6 +723,21 @@ <h2 class="heading settled heading" data-level=4 id=flex-items><span class=secno
     &lt;/span&gt;
 &lt;/div&gt;</pre>	</div>
 
+	<p class=note>
+		Authors reading this spec may want to
+		<a href=#item-margins>skip past the following box-generation details</a>.
+
+	<p>
+		The computed <a class=property data-link-type=propdesc href=http://www.w3.org/TR/CSS21/visuren.html#propdef-display title=display>display</a> of a <a data-link-type=dfn href=#flex-item title="flex item">flex item</a>
+		is determined by applying the table in
+		<a href=http://www.w3.org/TR/CSS2/visuren.html#dis-pos-flo>CSS 2.1 Chapter 9.7</a>
+		(except that internal table boxes are instead handled by anonymous box fixup, see below).
+
+	<p class=note>
+		The <a class=property data-link-type=propdesc href=http://www.w3.org/TR/CSS21/visuren.html#propdef-display title=display>display</a> computation on flex items as defined here
+		is expected to be superseded by a future specification
+		that defines a new <a class=property data-link-type=propdesc href=http://www.w3.org/TR/CSS21/visuren.html#propdef-display title=display>display</a> value specific to flex items.
+
 	<p>
 		Some values of <a class=property data-link-type=propdesc href=http://www.w3.org/TR/CSS21/visuren.html#propdef-display title=display>display</a> trigger the generation of anonymous boxes.
 		For example, a misparented <span class=css data-link-type=maybe title=table-cell>table-cell</span> child is fixed up