Skip to content

Commit b29122f

Browse files
committed
[css-grid-1] Clarify what we're fixing the row/column sizes for (figuring out available space). Also wordsmith. #3046.
1 parent fd17aa0 commit b29122f

File tree

1 file changed

+24
-9
lines changed

1 file changed

+24
-9
lines changed

css-grid-1/Overview.bs

+24-9
Original file line numberDiff line numberDiff line change
@@ -3608,18 +3608,28 @@ Grid Sizing Algorithm</h3>
36083608
</div>
36093609

36103610
<li>
3611-
Next, the <a>track sizing algorithm</a> resolves the sizes of the <a>grid rows</a>,
3612-
using the <a>grid column</a> sizes calculated in the previous step
3613-
and the effective column gap sizes after applying 'justify-content'.
3611+
Next, the <a>track sizing algorithm</a> resolves the sizes of the <a>grid rows</a>.
3612+
3613+
To find the <a>inline-axis</a> <a>available space</a>
3614+
for any items whose <a>block-axis</a> size contributions require it,
3615+
use the <a>grid column</a> sizes calculated in the previous step.
3616+
If the <a>grid container</a>’s <a>inline size</a> is <a>definite</a>,
3617+
also apply 'justify-content'
3618+
to account for the effective column gap sizes.
36143619

36153620
<li>
36163621
Then, if the <a>min-content contribution</a> of any grid item has changed
36173622
based on the row sizes and alignment calculated in step 2,
36183623
re-resolve the sizes of the <a>grid columns</a>
36193624
with the new <a lt="min-content contribution">min-content</a>
3620-
and <a>max-content contributions</a> (once only),
3621-
using the <a>grid row</a> sizes calculated in the previous step
3622-
along with the effective row gap sizes calculated by applying 'align-content'.
3625+
and <a>max-content contributions</a> (once only).
3626+
3627+
To find the <a>block-axis</a> <a>available space</a>
3628+
for any items whose <a>inline-axis</a> size contributions require it,
3629+
use the <a>grid row</a> sizes calculated in the previous step.
3630+
If the <a>grid container</a>’s <a>block size</a> is <a>definite</a>,
3631+
also apply 'align-content'
3632+
to account for the effective row gap sizes.
36233633

36243634
<div class="note">
36253635
This repetition is necessary for cases where the <a>inline size</a> of a <a>grid item</a>
@@ -3634,9 +3644,14 @@ Grid Sizing Algorithm</h3>
36343644
based on the column sizes and alignment calculated in step 3,
36353645
re-resolve the sizes of the <a>grid rows</a>
36363646
with the new <a lt="min-content contribution">min-content</a>
3637-
and <a>max-content contributions</a> (once only),
3638-
using the <a>grid column</a> sizes calculated in the previous step
3639-
along with the effective column gap sizes calculated by applying 'justify-content'.
3647+
and <a>max-content contributions</a> (once only).
3648+
3649+
To find the <a>inline-axis</a> <a>available space</a>
3650+
for any items whose <a>block-axis</a> size contributions require it,
3651+
use the <a>grid column</a> sizes calculated in the previous step.
3652+
If the <a>grid container</a>’s <a>inline size</a> is <a>definite</a>,
3653+
also apply 'justify-content'
3654+
to account for the effective column gap sizes.
36403655

36413656
<li>
36423657
Finally, the <a>grid container</a> is sized

0 commit comments

Comments
 (0)