Skip to content

Commit 8a87c76

Browse files
committed
[css-grid-3] Add behavior for stacking-axis self-alignment, per WG resolution. w3c#10275
1 parent 3baba27 commit 8a87c76

1 file changed

Lines changed: 16 additions & 0 deletions

File tree

css-grid-3/Overview.bs

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1119,6 +1119,22 @@ Alignment and Spacing</h2>
11191119
the [=grid container=]'s [=content box=] in the [=stacking axis=],
11201120
then the [=stacking range=] will be larger than the [=grid container=]'s [=content box=].
11211121

1122+
In the [=stacking axis=],
1123+
the [=self-alignment properties=] only apply to items that are adjacent to a gap in the layout,
1124+
i.e. placed in their [=grid track=](s) either immediately before a spanning item
1125+
or as the last item.
1126+
The [=alignment subject=] is the item's [=margin box=],
1127+
and the [=alignment container=] is that box plus the adjacent gap.
1128+
1129+
<figure>
1130+
<img src="images/align-self.png">
1131+
<figcaption>
1132+
The three highlighted items are the only ones with "gaps" following them,
1133+
so they're the only ones that will respond to 'align-items'.
1134+
Their [=alignment containers=] are indicated with the hatched areas.
1135+
</figcaption>
1136+
</figure>
1137+
11221138

11231139

11241140
ISSUE(10275): Is this a reasonable definition for how the [=self-alignment properties=] should work in the [=stacking axis=]?

0 commit comments

Comments
 (0)