@@ -817,6 +817,20 @@ Placement Precision: the 'item-tolerance' property</h3>
817817 see <a href='https://github.com/w3c/csswg-drafts/issues/3071'>discussions</a>
818818 on how that might work.
819819
820+ <h3 id="masonry-dense-packing">
821+ Dense Placement: the ''item-pack/dense'' keyword</h3>
822+
823+ In [=grid layout=] , ''grid-auto-flow: dense'' allows backtracking
824+ during the [[css-grid-2#auto-placement-algo|grid item placement algorithm]] .
825+ The ''item-pack/dense'' keyword similarly allows backtracking
826+ during the [[#masonry-layout-algorithm|masonry placement algorithm]] .
827+ However, because masonry placement and sizing are intertwined,
828+ an item can only backtrack into a compatible empty slot if
829+ the total used size of that slot’s tracks
830+ matches the used size of the item’s normal-placement tracks.
831+
832+ Note: This restriction avoids laying out the item more than once.
833+
820834<h3 id="masonry-layout-algorithm">
821835Masonry Layout and Placement Algorithm</h3>
822836
@@ -860,6 +874,18 @@ Masonry Layout and Placement Algorithm</h3>
860874 and then layout the item.
861875 Set the [=running position=] of the spanned [=grid axis=] tracks
862876 to <code><var> max_pos</var> + [=outer size=] + 'grid-gap' </code> .
877+
878+ <li>
879+ If the [=masonry container=] uses ''item-pack/dense'' packing,
880+ and there exists skipped empty space (e.g. due to spanning items)
881+ earlier in the layout into which the item, as it is sized now,
882+ could have fit without impacting other items’ placement
883+ if it were earlier in the placement order,
884+ and the tracks it would have spanned at that point
885+ have the same total used size as the tracks into which it is currently placed,
886+ move the item into that position
887+ and rewind the [=auto-placement cursor=] and the [=running position=]
888+ to their values before this item’s placement.
863889 </ol>
864890
865891 Note: This algorithm chooses the track
@@ -1495,6 +1521,8 @@ Recent Changes</h3>
14951521 and gave it an initial value of ''item-tolerance/normal'' .
14961522 (<a href="https://github.com/w3c/csswg-drafts/issues/10884">Issue 10884</a> ,
14971523 <a href="https://github.com/w3c/csswg-drafts/issues/12111">Issue 12111</a> )
1524+ * Defined [[#masonry-dense-packing|dense packing]] for [=masonry layout=] .
1525+ (<a href="https://github.com/w3c/csswg-drafts/issues/9326">Issue 9326</a> )
14981526 * Tweak baseline alignment to export the highest/lowest among the first/last items of every track.
14991527 (<a href="https://github.com/w3c/csswg-drafts/issues/9530">Issue 9530</a> )
15001528
0 commit comments