Description
<div id="a" style="width: max-content">
<div id="b" style="display: flow-root; width: 1000px; max-width: fit-content(100px + 100%)">
<div style="float: left; width: 25px"></div>
<div style="float: left; width: 25px"></div>
</div>
</div>
According to https://drafts.csswg.org/css-sizing-3/#cyclic-percentage-contribution
If the box is non-replaced, then the entire value of any max size property or preferred size property (width/max-width/height/max-height) specified as an expression containing a percentage (such as 10% or calc(10px + 0%)) that is cyclic is treated for the purpose of calculating the box’s intrinsic size contributions only as that property’s initial value.
This means that the intrinsic min/max-content contributions of #b
are 1000px
.
But does this make sense? Once #b
is laid out with a 1000px
wide containing block, its size will resolve to 50px
. It's normal for the intrinsic contributions to not match the final size, but here it looks weird since we know 50px
will be an upper limit. Also, in #10721 there are 2 proposals under consideration, but both treat max-width: fit-content
as max-content
when computing the max-content contribution. So if we do that for fit-content
, it seems we should do the same for a cyclic fit-content()
.
Then, proposal:
- If a
<length-percentage>
would resolve cyclic percentages against zero, thenfit-content(<length-percentage>)
resolves cyclic percentages against zero.
Note: the condition never holds in browsers, but it does in the spec. See [css-sizing] Nobody follows the spec about cyclic percentages in min sizing properties #10969 and [css-sizing] Nobody follows the spec about cyclic percentages in preferred&max sizing properties of replaced element #11452. - If a
<length-percentage>
with cyclic percentages is treated as0px
, thenfit-content(<length-percentage>)
with cyclic percentages is treated asfit-content(0px)
i.e.min-content
.
Note: the condition never holds in the spec, but it does in browsers. - If a
<length-percentage>
with cyclic percentages is treated asnone
, thenfit-content(<length-percentage>)
with cyclic percentages is treated asfit-content(calc(1px * infinity))
i.e.max-content
. - If a
<length-percentage>
with cyclic percentages is treated as the automatic size, thenfit-content(<length-percentage>)
with cyclic percentages is treated asfit-content
, i.e.min-content
for the min-content contribution andmax-content
for the max-content contribution. - If a
<length-percentage>
with cyclic percentages is treated as the automatic minimum size, thenfit-content(<length-percentage>)
with cyclic percentages is treated asmin-content
.
Note: the condition never holds in the spec, and almost never holds in browsers.
Metadata
Metadata
Assignees
Labels
Type
Projects
Status