8000 [css-grid] Add topic sentences in bold. · xfq/csswg-drafts@0784ba8 · GitHub
Skip to content

Commit 0784ba8

Browse files
fantasaifantasai
committed
[css-grid] Add topic sentences in bold.
1 parent 4a3bdfe commit 0784ba8

2 files changed

Lines changed: 57 additions & 23 deletions

File tree

‎css-grid/Overview.bs‎

Lines changed: 28 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -3298,40 +3298,54 @@ Resolve Content-Based Track Sizing Functions: Second Try</h3>
32983298
consider the items in it with a span of 1:
32993299
<ul>
33003300
<li>
3301-
If the track has a ''min-content'' <i>sizing function</i>,
3302-
set its <i>base size</i> or <i>growth limit</i>
3303-
(for a ''min-content'' <i>min track sizing function</i> or <i>max track sizing function</i>, respectively)
3301+
<strong>For min-content minimums:</strong>
3302+
If the track has a ''min-content'' <i>min track sizing function</i>,
3303+
set its <i>base size</i>
33043304
to the maximum of the items’ <i>min-size contributions</i>.
33053305
<li>
3306-
If the track has a ''max-content'' <i>sizing function</i>,
3307-
set its <i>base size</i> or <i>growth limit</i>
3308-
(for a ''max-content'' <i>min track sizing function</i> or <i>max track sizing function</i>, respectively)
3306+
<strong>For max-content minimums:</strong>
3307+
If the track has a ''max-content'' <i>min track sizing function</i>,
3308+
set its <i>base size</i>
3309+
to the maximum of the items’ <i>max-size contributions</i>.
3310+
<li>
3311+
<strong>For min-content maximums:</strong>
3312+
If the track has a ''min-content'' <i>max track sizing function</i>,
3313+
set its <i>growth limit</i>
3314+
to the maximum of the items’ <i>min-size contributions</i>.
3315+
<li>
3316+
<strong>For max-content maximums:</strong>
3317+
If the track has a ''max-content'' <i>max track sizing function</i>,
3318+
set its <i>growth limit</i>
33093319
to the maximum of the items’ <i>max-size contributions</i>.
33103320
</ul>
33113321
<li>
33123322
<strong>Increase sizes to accommodate spanning items:</strong>
33133323
Next, consider the items with a span of 2
33143324
that do not span a track with a <i>flexible sizing function</i>:
33153325
<ol>
3316-
<li><strong>For min-content minimums:</strong>
3326+
<li>
3327+
<strong>For min-content minimums:</strong>
33173328
First increase the <i>base size</i> of tracks with
33183329
a <i>min track sizing function</i> of ''min-content'' or ''max-content''
33193330
by <a href="#extra-space">distributing extra space</a> as needed
33203331
account for these items' <i>min-size contributions</i>.
3321-
<li><strong>For max-content minimums:</strong>
3332+
<li>
3333+
<strong>For max-content minimums:</strong>
33223334
Next continue to increase the <i>base size</i> of tracks with
33233335
a <i>min track sizing function</i> of ''max-content''
33243336
by <a href="#extra-space">distributing extra space</a> as needed
33253337
to account for these items' <i>max-size contributions</i>.
3326-
<li><strong>For min-content maximums:</strong>
3338+
<li>
3339+
<strong>For min-content maximums:</strong>
33273340
Third increase the <i>growth limit</i> of tracks with
33283341
a <i>max track sizing function</i> of ''min-content'' or ''max-content''
33293342
by <a href="#extra-space">distributing extra space</a> as needed
33303343
to account for these items' <i>min-size contributions</i>.
33313344
Mark any tracks whose <i>growth limit</i> changed
33323345
from infinite to finite in this step
33333346
as infinitely growable for the next step.
3334-
<li><strong>For max-content maximums:</strong>
3347+
<li>
3348+
<strong>For max-content maximums:</strong>
33353349
Lastly continue to increase the <i>growth limit</i> of tracks with
33363350
a <i>max track sizing function</i> of ''max-content''
33373351
by <a href="#extra-space">distributing extra space</a> as needed
@@ -3353,18 +3367,21 @@ Resolve Content-Based Track Sizing Functions: Second Try</h3>
33533367
For each considered item,
33543368
<ol>
33553369
<li>
3370+
<strong>Find the space to distribute:</strong>
33563371
Subtract the corresponding size (<i>base size</i> or <i>growth limit</i>) of each spanned track
33573372
from the item's size contribution to find the the item's remaining size contribution.
33583373
(For infinite <i>growth limits</i>, use the track's <i>base size</i> instead.)
33593374
This is the space to distribute.
33603375
<pre><var>extra-space</var> = <var>size-contribution</var> - ∑<var>track-sizes</var></pre>
33613376
<li>
3377+
<strong>Distribute space up to growth limits:</strong>
33623378
Distribute the space equally to the tracked increase of each spanned track with an affected size,
33633379
freezing tracks as they reach their <i>growth limits</i>.
33643380
<pre><var>track-size-increase</var> = max(<var>track-size-increase</var>, <var>share-of-extra-space</var>)</pre>
33653381
If a track is marked as infinitely growable in this phase,
33663382
treat its <i>growth limit</i> as infinite for this calculation.
33673383
<li>
3384+
<strong>Distribute space beyond growth limits:</strong>
33683385
If space remains after all tracks are frozen,
33693386
unfreeze and continue to increase&hellip;
33703387
<ul>
@@ -3380,7 +3397,7 @@ Resolve Content-Based Track Sizing Functions: Second Try</h3>
33803397
all affected tracks.
33813398
</ul>
33823399
<li>
3383-
Update the tracks' affected sizes
3400+
<strong>Update the tracks' affected sizes</strong>
33843401
by folding in the calculated increase
33853402
so that the next round of space distribution will account for the increase.
33863403
(If the <i>growth limit</i> is infinite,

‎css-grid/Overview.html‎

Lines changed: 29 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -3278,40 +3278,54 @@ <h3 class="heading settled heading" data-level=11.5 id=resolve-intrinsic><span c
32783278
consider the items in it with a span of 1:
32793279
<ul>
32803280
<li>
3281-
If the track has a <a class=css data-link-type=maybe href=#valuedef-min-content title=min-content>min-content</a> <a data-link-type=dfn href=#track-sizing-function title="sizing function">sizing function</a>,
3282-
set its <a data-link-type=dfn href=#base-size title="base size">base size</a> or <a data-link-type=dfn href=#growth-limit title="growth limit">growth limit</a>
3283-
(for a <a class=css data-link-type=maybe href=#valuedef-min-content title=min-content>min-content</a> <a data-link-type=dfn href=#min-track-sizing-function title="min track sizing function">min track sizing function</a> or <a data-link-type=dfn href=#max-track-sizing-function title="max track sizing function">max track sizing function</a>, respectively)
3281+
<strong>For min-content minimums:</strong>
3282+
If the track has a <a class=css data-link-type=maybe href=#valuedef-min-content title=min-content>min-content</a> <a data-link-type=dfn href=#min-track-sizing-function title="min track sizing function">min track sizing function</a>,
3283+
set its <a data-link-type=dfn href=#base-size title="base size">base size</a>
32843284
to the maximum of the items’ <a data-link-type=dfn href=http://dev.w3.org/csswg/css-sizing-3/#min-size-contribution title="min-size contributions">min-size contributions</a>.
32853285
<li>
3286-
If the track has a <a class=css data-link-type=maybe href=#valuedef-max-content title=max-content>max-content</a> <a data-link-type=dfn href=#track-sizing-function title="sizing function">sizing function</a>,
3287-
set its <a data-link-type=dfn href=#base-size title="base size">base size</a> or <a data-link-type=dfn href=#growth-limit title="growth limit">growth limit</a>
3288-
(for a <a class=css data-link-type=maybe href=#valuedef-max-content title=max-content>max-content</a> <a data-link-type=dfn href=#min-track-sizing-function title="min track sizing function">min track sizing function</a> or <a data-link-type=dfn href=#max-track-sizing-function title="max track sizing function">max track sizing function</a>, respectively)
3286+
<strong>For max-content minimums:</strong>
3287+
If the track has a <a class=css data-link-type=maybe href=#valuedef-max-content title=max-content>max-content</a> <a data-link-type=dfn href=#min-track-sizing-function title="min track sizing function">min track sizing function</a>,
3288+
set its <a data-link-type=dfn href=#base-size title="base size">base size</a>
3289+
to the maximum of the items’ <a data-link-type=dfn href=http://dev.w3.org/csswg/css-sizing-3/#max-size-contribution title="max-size contributions">max-size contributions</a>.
3290+
<li>
3291+
<strong>For min-content maximums:</strong>
3292+
If the track has a <a class=css data-link-type=maybe href=#valuedef-min-content title=min-content>min-content</a> <a data-link-type=dfn href=#max-track-sizing-function title="max track sizing function">max track sizing function</a>,
3293+
set its <a data-link-type=dfn href=#growth-limit title="growth limit">growth limit</a>
3294+
to the maximum of the items’ <a data-link-type=dfn href=http://dev.w3.org/csswg/css-sizing-3/#min-size-contribution title="min-size contributions">min-size contributions</a>.
3295+
<li>
3296+
<strong>For max-content maximums:</strong>
3297+
If the track has a <a class=css data-link-type=maybe href=#valuedef-max-content title=max-content>max-content</a> <a data-link-type=dfn href=#max-track-sizing-function title="max track sizing function">max track sizing function</a>,
3298+
set its <a data-link-type=dfn href=#growth-limit title="growth limit">growth limit</a>
32893299
to the maximum of the items’ <a data-link-type=dfn href=http://dev.w3.org/csswg/css-sizing-3/#max-size-contribution title="max-size contributions">max-size contributions</a>.
32903300
</ul>
32913301
<li>
32923302
<strong>Increase sizes to accommodate spanning items:</strong>
32933303
Next, consider the items with a span of 2
32943304
that do not span a track with a <a data-link-type=dfn href=#flexible-sizing-function title="flexible sizing function">flexible sizing function</a>:
32953305
<ol>
3296-
<li><strong>For min-content minimums:</strong>
3306+
<li>
3307+
<strong>For min-content minimums:</strong>
32973308
First increase the <a data-link-type=dfn href=#base-size title="base size">base size</a> of tracks with
3298-
<a data-link-type=dfn href=#min-track-sizing-function title="min track sizing function">min track sizing function</a> of <a class=css data-link-type=maybe href=#valuedef-min-content title=min-content>min-content</a> or <a class=css data-link-type=maybe href=#valuedef-max-content title=max-content>max-content</a>
3309+
a <a data-link-type=dfn href=#min-track-sizing-function title="min track sizing function">min track sizing function</a> of <a class=css data-link-type=maybe href=#valuedef-min-content title=min-content>min-content</a> or <a class=css data-link-type=maybe href=#valuedef-max-content title=max-content>max-content</a>
32993310
by <a href=#extra-space>distributing extra space</a> as needed
33003311
account for these items' <a data-link-type=dfn href=http://dev.w3.org/csswg/css-sizing-3/#min-size-contribution title="min-size contributions">min-size contributions</a>.
3301-
<li><strong>For max-content minimums:</strong>
3312+
<li>
3313+
<strong>For max-content minimums:</strong>
33023314
Next continue to increase the <a data-link-type=dfn href=#base-size title="base size">base size</a> of tracks with
33033315
a <a data-link-type=dfn href=#min-track-sizing-function title="min track sizing function">min track sizing function</a> of <a class=css data-link-type=maybe href=#valuedef-max-content title=max-content>max-content</a>
33043316
by <a href=#extra-space>distributing extra space</a> as needed
33053317
to account for these items' <a data-link-type=dfn href=http://dev.w3.org/csswg/css-sizing-3/#max-size-contribution title="max-size contributions">max-size contributions</a>.
3306-
<li><strong>For min-content maximums:</strong>
3318+
<li>
3319+
<strong>For min-content maximums:</strong>
33073320
Third increase the <a data-link-type=dfn href=#growth-limit title="growth limit">growth limit</a> of tracks with
33083321
a <a data-link-type=dfn href=#max-track-sizing-function title="max track sizing function">max track sizing function</a> of <a class=css data-link-type=maybe href=#valuedef-min-content title=min-content>min-content</a> or <a class=css data-link-type=maybe href=#valuedef-max-content title=max-content>max-content</a>
33093322
by <a href=#extra-space>distributing extra space</a> as needed
33103323
to account for these items' <a data-link-type=dfn href=http://dev.w3.org/csswg/css-sizing-3/#min-size-contribution title="min-size contributions">min-size contributions</a>.
33113324
Mark any tracks whose <a data-link-type=dfn href=#growth-limit title="growth limit">growth limit</a> changed
33123325
from infinite to finite in this step
33133326
as infinitely growable for the next step.
3314-
<li><strong>For max-content maximums:</strong>
3327+
<li>
3328+
<strong>For max-content maximums:</strong>
33153329
Lastly continue to increase the <a data-link-type=dfn href=#growth-limit title="growth limit">growth limit</a> of tracks with
33163330
a <a data-link-type=dfn href=#max-track-sizing-function title="max track sizing function">max track sizing function</a> of <a class=css data-link-type=maybe href=#valuedef-max-content title=max-content>max-content</a>
33173331
by <a href=#extra-space>distributing extra space</a> as needed
@@ -3333,16 +3347,19 @@ <h3 class="heading settled heading" data-level=11.5 id=resolve-intrinsic><span c
33333347
<p> For each considered item,
33343348
<ol>
33353349
<li>
3350+
<strong>Find the space to distribute:</strong>
33363351
Subtract the corresponding size (<a data-link-type=dfn href=#base-size title="base size">base size</a> or <a data-link-type=dfn href=#growth-limit title="growth limit">growth limit</a>) of each spanned track
33373352
from the item’s size contribution to find the the item’s remaining size contribution.
33383353
(For infinite <a data-link-type=dfn href=#growth-limit title="growth limits">growth limits</a>, use the track’s <a data-link-type=dfn href=#base-size title="base size">base size</a> instead.)
33393354
This is the space to distribute.
33403355
<pre><var>extra-space</var> = <var>size-contribution</var> - ∑<var>track-sizes</var></pre> <li>
3356+
<strong>Distribute space up to growth limits:</strong>
33413357
Distribute the space equally to the tracked increase of each spanned track with an affected size,
33423358
freezing tracks as they reach their <a data-link-type=dfn href=#growth-limit title="growth limits">growth limits</a>.
33433359
<pre><var>track-size-increase</var> = max(<var>track-size-increase</var>, <var>share-of-extra-space</var>)</pre><p> If a track is marked as infinitely growable in this phase,
33443360
treat its <a data-link-type=dfn href=#growth-limit title="growth limit">growth limit</a> as infinite for this calculation.
33453361
<li>
3362+
<strong>Distribute space beyond growth limits:</strong>
33463363
If space remains after all tracks are frozen,
33473364
unfreeze and continue to increase…
33483365
<ul>
@@ -3358,7 +3375,7 @@ <h3 class="heading settled heading" data-level=11.5 id=resolve-intrinsic><span c
33583375
all affected tracks.
33593376
</ul>
33603377
<li>
3361-
Update the tracks' affected sizes
3378+
<strong>Update the tracks' affected sizes</strong>
33623379
by folding in the calculated increase
33633380
so that the next round of space distribution will account for the increase.
33643381
(If the <a data-link-type=dfn href=#growth-limit title="growth limit">growth limit</a> is infinite,

0 commit comments

Comments
 (0)
< 2BE1 /div>