Skip to content

Commit 564dba3

Browse files
committed
[css-grid-3] Specify how large negative margins (don't) affect auto-placement. w3c#12918
1 parent 260c287 commit 564dba3

File tree

1 file changed

+15
-0
lines changed

1 file changed

+15
-0
lines changed

css-grid-3/Overview.bs

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -896,6 +896,15 @@ Masonry Layout and Placement Algorithm</h3>
896896
Set the [=running position=] of the spanned [=grid axis=] tracks
897897
to <code><var>max_pos</var> + [=outer size=] + 'grid-gap'</code>.
898898

899+
For this purpose, the [=outer sizes=] of the box are floored at zero.
900+
901+
Note: That is, if the box has sufficiently large negative margins,
902+
it won't somehow count as a negative <em>size</em> here.
903+
The [=running position=] of a track never decreases,
904+
so a negative-sized box
905+
won't cause future normally-sized items placed in the track
906+
to overlap previous items.
907+
899908
<li>
900909
If the [=masonry container=] uses ''item-pack/dense'' packing,
901910
and there exists skipped empty space in the layout
@@ -910,6 +919,12 @@ Masonry Layout and Placement Algorithm</h3>
910919
Rewind the [=auto-placement cursor=] and the [=running position=]
911920
to their values before this item’s placement.
912921

922+
Items that <em>visually</em> intrude into preceding empty spaces
923+
(via negative margins, ''position: relative'', transforms, etc.),
924+
do not affect the size of those empty spaces.
925+
<span class=note>Later items might get placed in those spaces
926+
and visually overlap these previous items.</span>
927+
913928
Note: Dense packing both ignores the [=auto-placement cursor=] when backfilling,
914929
and does not update it after placement.
915930
If there aren't any acceptable placement gaps to backfill, though,

0 commit comments

Comments
 (0)