Skip to content

Commit 3bc73f8

Browse files
committed
[css-grid] Add fit-content() per WG resolution
1 parent dd3a124 commit 3bc73f8

File tree

1 file changed

+18
-3
lines changed

1 file changed

+18
-3
lines changed

css-grid/Overview.bs

Lines changed: 18 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1203,7 +1203,7 @@ Explicit Track Sizing: the 'grid-template-rows' and 'grid-template-columns' prop
12031203
<dfn>&lt;auto-track-list></dfn> = [ <<line-names>>? [ <<fixed-size>> | <<fixed-repeat>> ] ]+ <<auto-repeat>>
12041204
[ <<line-names>>? [ <<fixed-size>> | <<fixed-repeat>> ] ]+ <<line-names>>?
12051205

1206-
<dfn>&lt;track-size></dfn> = <<track-breadth>> | minmax( <<inflexible-breadth>> , <<track-breadth>> )
1206+
<dfn>&lt;track-size></dfn> = <<track-breadth>> | minmax( <<inflexible-breadth>> , <<track-breadth>> ) | fit-content( [ <<length>> | <<percentage>> ] )
12071207
<dfn>&lt;fixed-size></dfn> = <<fixed-breadth>> | minmax( <<fixed-breadth>> , <<track-breadth>> ) | minmax( <<inflexible-breadth>> , <<fixed-breadth>> )
12081208
<dfn>&lt;track-breadth></dfn> = <<length>> | <<percentage>> | <<flex>> | min-content | max-content | auto
12091209
<dfn>&lt;inflexible-breadth></dfn> = <<length>> | <<percentage>> | min-content | max-content | auto
@@ -1267,6 +1267,14 @@ Explicit Track Sizing: the 'grid-template-rows' and 'grid-template-columns' prop
12671267

12681268
Note: ''grid-template-rows/auto'' track sizes (and only ''grid-template-rows/auto'' track sizes)
12691269
can be streched by the 'align-content' and 'justify-content' properties.
1270+
1271+
<dt><dfn lt="fit-content()">fit-content( [ <<length>> | <<percentage>> ] )</dfn>
1272+
<dd>
1273+
Represents the formula
1274+
<code>min(''max-content'', max(''auto'', <var>argument</var>))</code>,
1275+
which is calculated similar to ''auto'' (i.e. ''minmax(auto, max-content)''),
1276+
except that the track size is clamped at <var>argument</var>
1277+
if it is greater than the ''auto'' minimum.
12701278
</dl>
12711279

12721280
In <<line-names>>, the <<custom-ident>> additionally excludes the keyword <css>span</css>.
@@ -3549,13 +3557,17 @@ Track Sizing Terminology</h3>
35493557
<dd>
35503558
If the track was sized with a ''minmax()'' function,
35513559
this is the first argument to that function.
3552-
Otherwise, it's the track's sizing function.
3560+
If the track was sized with a <<flex>> value or ''fit-content()'' function,
3561+
''auto''.
3562+
Otherwise, the track's sizing function.
35533563

35543564
<dt><dfn>max track sizing function</dfn>
35553565
<dd>
35563566
If the track was sized with a ''minmax()'' function,
35573567
this is the second argument to that function.
3558-
Otherwise, it's the track's sizing function.
3568+
If the track was sized with a ''fit-content()'' function,
3569+
''max-content''.
3570+
Otherwise, the track's sizing function.
35593571

35603572
<dt><dfn>available grid space</dfn>
35613573
<dd>
@@ -3889,6 +3901,9 @@ Maximize Tracks</h3>
38893901
If the <a>free space</a> is positive, distribute it equally to all tracks,
38903902
freezing tracks as they reach their <a>growth limits</a>
38913903
(and continuing to grow the unfrozen tracks as needed).
3904+
For tracks sized with ''fit-content()'',
3905+
first clamp the <a>growth limit</a>
3906+
by the track sizing function given as the ''fit-content()'' argument.
38923907

38933908
For the purpose of this step:
38943909
if sizing the <a>grid container</a> under a <a>max-content constraint</a>,

0 commit comments

Comments
 (0)