@@ -3344,34 +3344,40 @@ Aligning the Grid: the 'justify-content' and 'align-content' properties</h3>
33443344 Issue: Add example of fixed size spanner getting extra space from content-distribution.
33453345
33463346<h3 id='grid-baselines'>
3347- Grid Baselines</h3>
3347+ Grid Container Baselines</h3>
33483348
3349- The baselines of a <a>grid container</a> are determined as follows:
3349+ The first/last baselines of a <a>grid container</a> are determined as follows:
33503350
33513351 <ol>
33523352 <li>
3353- If any of the <a>grid items</a> whose areas intersect the <a>grid container</a> ’s first row/column
3353+ If any of the <a>grid items</a> whose areas intersect the <a>grid container</a> ’s first/last row/column
33543354 <a href="#baseline-participation">participate in baseline alignment</a> ,
3355- the grid container's baseline is the baseline of those <a>grid items</a> .
3355+ the grid container's <a>baseline set</a> in that axis
3356+ is <a lt="generate baselines">generated</a> from
3357+ the shared <a>alignment baseline</a> of those <a>grid items</a> .
33563358
33573359 <li>
3358- Otherwise, if the grid container has at least one <a>grid item</a> whose area intersects the first row/column,
3359- and the first such <a>grid item</a> (in <a>order-modified grid order</a> ) has a baseline
3360- parallel to the relevant axis,
3361- the grid container's baseline is that baseline.
3360+ Otherwise, if the grid container has at least one <a>grid item</a> whose area intersects the first/last row/column,
3361+ and the first/last such <a>grid item</a> (in <a>grid order</a> )
3362+ has a baseline set parallel to the relevant axis,
3363+ the grid container's first/last baseline set in that axis
3364+ is <a lt="generate baselines">generated</a> from
3365+ that <a>grid item</a> ’s <a>alignment baseline</a> .
33623366
33633367 <li>
3364- Otherwise, the grid container's baseline is <a href="https://www.w3.org/TR/css3-writing-modes/#inline-alignment">synthesized</a>
3365- from the first item's (in <a>order-modified grid order</a> ) content box,
3368+ Otherwise, the grid container's first/last baseline set
3369+ is <a lt="synthesize baselines">synthesized</a>
3370+ from the first/last item's (in <a>grid order</a> ) content box,
33663371 or, failing that, from the grid container's content box.
33673372 </ol>
33683373
33693374 A <a>grid item</a> <dfn export id="baseline-participation">participates in baseline alignment</dfn> in a particular dimension
33703375 if its value for 'align-self' or 'justify-self' , as appropriate, is ''baseline''
33713376 and its inline axis is parallel to that dimension.
33723377
3373- <dfn export lt="order-modified grid order">'order'-modified grid order</dfn> is the order in which
3374- <a>grid items</a> are encountered when traversing the grid's <a>grid cells</a> ,
3378+ <dfn export lt="grid order|grid-modified document order">'grid-modified document order (grid order)</dfn>
3379+ is the order in which <a>grid items</a> are encountered
3380+ when traversing the grid's <a>grid cells</a> ,
33753381 in row-major order if calculating the inline-axis baseline,
33763382 or in column-major order if calculating the block-axis baseline.
33773383 If two items are encountered at the same time,
@@ -3385,6 +3391,10 @@ Grid Baselines</h3>
33853391 When <a href="https://www.w3.org/TR/CSS21/tables.html#height-layout">determining the baseline of a table cell</a> ,
33863392 a grid container provides a baseline just as a line box or table-row does. [[!CSS21]]
33873393
3394+ See [[css-writing-modes-3#intro-baselines]]
3395+ and [[css-align-3##baseline-rules]]
3396+ for more information on baselines.
3397+
33883398<!--
33893399 ██████ ████ ████████ ████ ██ ██ ██████
33903400██ ██ ██ ██ ██ ███ ██ ██ ██
0 commit comments