Skip to content

Commit

Permalink
[css-grid-1] Make auto margin prose fully normative. #5923
Browse files Browse the repository at this point in the history
  • Loading branch information
fantasai committed Jun 15, 2021
1 parent 729cc6a commit 16ed028
Showing 1 changed file with 12 additions and 7 deletions.
19 changes: 12 additions & 7 deletions css-grid-1/Overview.bs
Expand Up @@ -3548,23 +3548,24 @@ Gutters: the 'row-gap', 'column-gap', and 'gap' properties</h3>
<h3 id='auto-margins'>
Aligning with <a value for="margin">auto</a> margins</h3>

<em>This section is non-normative.
The normative definition of how margins affect grid items is in [[#layout-algorithm]].</em>

Auto margins on <a>grid items</a> have an effect very similar to auto margins in block flow:
Auto [=margins=] on <a>grid items</a> have an effect
very similar to auto margins in [=block layout=]:

<ul>
<li>
During calculations of <a>grid track</a> sizes, auto margins are treated as ''0''.
During calculations of <a>grid track</a> sizes,
''margin/auto'' margins are treated as ''0''.

<li>
''margin/auto'' margins absorb positive free space
As defined for the [=inline axis=] of [=block layout=]
(see <a href="https://www.w3.org/TR/CSS2/visudet.html#blockwidth">CSS2&sect;10.3.3</a>),
''margin/auto'' margins in either axis absorb positive free space
prior to alignment via the <a>box alignment properties</a>,
thereby disabling the effects of any [=self-alignment properties=]
in that axis.

<li>
Overflowing elements ignore their ''margin/auto'' margins
Overflowing [=grid items=] resolve their ''margin/auto'' margins to zero
and overflow as specified by their <a>box alignment properties</a>.
</ul>

Expand Down Expand Up @@ -4696,6 +4697,10 @@ Changes since the <a href="https://www.w3.org/TR/2020/CRD-css-grid-1-20201218/">
now that [=non-replaced elements=] can also have an aspect ratio
via 'aspect-ratio'. [[CSS-SIZING-4]]
(<a href="https://github.com/w3c/csswg-drafts/issues/6069">Issue 6069</a>)
<li id="change-2020-autm-margins">
Made [[#auto-margins]] normative and tightened up wording,
since some aspects of this behavior were not otherwise defined elsewhere.
(part of <a href="https://github.com/w3c/csswg-drafts/issues/5923">Issue 5923</a>)
</ul>

<h3 id="changes-202008">
Expand Down

0 comments on commit 16ed028

Please sign in to comment.