[css-grid] Sync fragmentation section to Flexbox (which has more developed rules).

Author: fantasai

css-grid/Overview.bs

@@ -3058,14 +3058,68 @@ Find the Size of an ''fr''</h4>
 <h2 id='pagination'>
 Fragmenting Grid Layout</h2>
 
-	Grid containers break across fragment containers (fragmentainers) [[!CSS3-BREAK]] between
-	grid rows. The break-* properties do not apply to grid areas. When fragmentating grid containers
-	the goal is to minimize the number of grid areas that get fragmented due to their grid row
-	being fragmented.
+
+	<p>
+		<a>Grid containers</a> can break across pages
+		between rows
+		and inside items.
+		The <a property lt="break-before">break-*</a> properties apply to grid containers
+		as normal for the formatting context in which they participate.
+		This section defines how they apply to grid items
+		and the contents of grid items.
+
+	<p>
+		The following breaking rules refer to the fragmentation container as the “page”.
+		The same rules apply to any other fragmentation containers.
+		(Substitute “page” with the appropriate fragmentation container type as needed.)
+		See the CSS3 Fragmentation Module [[!CSS3-BREAK]].
+
+	<p>
+		The exact layout of a fragmented grid container is not defined in this level of Grid Layout.
+		However, breaks inside a grid container are subject to the following rules:
+
+	<ul>
+		<li>
+			The 'break-before' and 'break-after' properties on flex items
+			are propagated to their grid row.
+			The 'break-before' property on the first row
+			and the 'break-after' property on the last row
+			are propagated to the grid container.
+
+		<li>
+			A forced break inside a grid item effectively increases the size of its contents;
+			it does not trigger a forced break inside sibling items.
+
+		<li>
+			<a href="http://www.w3.org/TR/css3-break/#btw-blocks">Class A break opportunities</a> occur between rows,
+			and <a href="http://www.w3.org/TR/css3-break/#end-block">Class C break opportunities</a> occur between the first/last row and the flex container's content edges.
+			[[!CSS3-BREAK]]
+
+		<li>
+			When a grid container is continued after a break,
+			the space available to its <a>grid items</a>
+			(in the block flow direction of the fragmentation context)
+			is reduced by the space consumed by grid container fragments on previous pages.
+			The space consumed by a grid container fragment is
+			the size of its content box on that page.
+			If as a result of this adjustment the available space becomes negative,
+			it is set to zero.
+
+		<li>
+			Aside from the rearrangement of items imposed by the previous point,
+			UAs should attempt to minimize distortation of the grid container
+			with respect to unfragmented flow.
+	</ul>
+
 
 <h3 id="fragmentation-alg">
 Sample Fragmentation Algorithm</h3>
 
+	<p class="issue">
+		This is just a rough draft.
+		This section needs to be severely cross-checked with the [[CSS3-FLEXBOX]] algorithm.
+		Feedback overall is welcome; please reference the rules above instead as implementation guidance.
+
 	<ol>
 		<li>
 			Layout the grid following the <a section href="#layout-algorithm"></a> by using the
@@ -3075,10 +3129,6 @@ Sample Fragmentation Algorithm</h3>
 		<li>
 			Layout the grid container using the values resolved in the previous step.
 
-		<li>
-			If a grid row extends past the current fragment and it is not the first grid row in
-			this fragment; push it to the next fragment. Do this even if the grid row has no items.
-
 		<li>
 			If a grid area dimensions change due to fragmentation (do not include items that
 			span rows in this decision), increase the grid row as necessary for rows that either:
@@ -3131,6 +3181,7 @@ Changes</h2>
 	<a href=http://www.w3.org/TR/2014/WD-css3-grid-layout-20140513/>13 May 2014 Working Draft</a>.
 
 	<ul>
+		<li>Added first draft of grid container <a href="#pagination">fragmenting rules</a>.
 		<li>Applied 'align-content' and 'justify-content' to the <a>grid tracks</a> rather than to the <a>grid</a> as a monolithic unit, to allow justification of grid items across the grid container.
 		<li>Removed <css>stack</css> value from 'grid-auto-flow'.
 		<li>Added ''auto'' keyword to ''repeat()'' function for auto-filled tracks.