[css-grid-3][masonry] Define dense packing for masonry #9326

Author: fantasai

css-grid-3/Overview.bs

@@ -830,6 +830,20 @@ Placement Precision: the 'item-tolerance' property</h3>
 	see <a href='https://github.com/w3c/csswg-drafts/issues/3071'>discussions</a>
 	on how that might work.
 
+<h3 id="masonry-dense-packing">
+Dense Placement: the ''item-pack/dense'' keyword</h3>
+
+	In [=grid layout=], ''grid-auto-flow: dense'' allows backtracking
+	during the [[css-grid-2#auto-placement-algo|grid item placement algorithm]].
+	The ''item-pack/dense'' keyword similarly allows backtracking
+	during the [[#masonry-layout-algorithm|masonry placement algorithm]].
+	However, because masonry placement and sizing are intertwined,
+	an item can only backtrack into a compatible empty slot if
+	the total used size of that slot’s tracks
+	matches the used size of the item’s normal-placement tracks.
+
+	Note: This restriction avoids laying out the item more than once.
+
 <h3 id="masonry-layout-algorithm">
 Masonry Layout and Placement Algorithm</h3>
 
@@ -873,6 +887,18 @@ Masonry Layout and Placement Algorithm</h3>
 			and then layout the item.
 			Set the [=running position=] of the spanned  [=grid axis=] tracks
 			to <code><var>max_pos</var> + [=outer size=] + 'grid-gap'</code>.
+
+		<li>
+			If the [=masonry container=] uses ''item-pack/dense'' packing,
+			and there exists skipped empty space (e.g. due to spanning items)
+			in the layout into which the item, as it is sized now,
+			could have fit without impacting other items’ placement
+			if it were earlier in the placement order,
+			and the tracks it would have spanned at that point
+			have the same total used size as the tracks into which it is currently placed,
+			move the item into the earliest such position
+			and rewind the [=auto-placement cursor=] and the [=running position=]
+			to their values before this item’s placement.
 	</ol>
 
 	Note: This algorithm chooses the track
@@ -1510,6 +1536,8 @@ Recent Changes</h3>
 		 <a href="https://github.com/w3c/csswg-drafts/issues/12111">Issue 12111</a>)
 	* Added a placeholder for a [=masonry layout=] 'display' value.
 		(<a href="https://github.com/w3c/csswg-drafts/issues/12022">Issue 12022</a>)
+	* Defined [[#masonry-dense-packing|dense packing]] for [=masonry layout=].
+		(<a href="https://github.com/w3c/csswg-drafts/issues/9326">Issue 9326</a>)
 	* Tweak baseline alignment to export the highest/lowest among the first/last items of every track.
 		(<a href="https://github.com/w3c/csswg-drafts/issues/9530">Issue 9530</a>)