Repository navigation
[css-flexbox-1] When can available space for flex items be infinite? #6476
Description
I’m implementing Step 2: determine the available main and cross space for the flex items, and I’m trying to better understand what constitutes definite and indefinite sizes, and by extension definite and infinite available space.
CSS Box Sizing Level 3 defines definite size as:
A size that can be determined without performing layout; that is, a , a measure of text (without consideration of line-wrapping), a size of the initial containing block, or a or other formula (such the “stretch-fit” sizing of non-replaced blocks [CSS2]) that is resolved solely against definite sizes.
Additionally, the size of the containing block of an absolutely positioned element is always definite with respect to that element.
It wasn’t clear to me if intrinsic sizes counted as definite, and after some digging found [css-sizing] definite sizes and shrink-wrapping and the WG resolution saying that:
treat intrinsic sizes as definite when they don't rely on layout, by default
Approaching this from another angle, I tried to think if situations where the available space could possibly be infinite. These are the cases I was able to identify:
- flex container
block-sizecomputes toauto, and the flex container participates in flow layout - flex container
block-sizecomputes to a<percentage>, and the containing block’sblock-sizedepends on content; this creates a cyclic dependency, so<percentage>behaves asauto
Interestingly, I wasn’t able to think of one situation where the available space in the inline dimension of the flex container would ever be infinite. Even in orthogonal flows the inline size of the flex container seems to be resolved against a fallback size defined in Available Space in Orthogonal Flows. I was unable to reproduce the case where the flex container would lay its box out at its max-content size when given “infinite available inline space” as described in Auto-sizing Other Orthogonal Flow Roots.
So I have two questions:
- is there a finite list of cases where available space for flex items can be infinite? Is my list correct?
- alternatively, how should one interpret phrases like “performing layout”, or “real layout” when trying to identify definite sizes which shouldn’t rely on layout?
Activity
tabatkins commentedon Aug 12, 2021
You're right that there's no situation in which the flexbox will see an infinite inline available space, due to the WM clamping rule.
For the block axis, available space is infinite for laying out block-level boxes inside indefinite block containers, and this gets passed through to descendants for their initial layout pass.
fantasai commentedon Aug 12, 2021
Re-opening to wait for commenter response. :) @andyjakubowski let us know if this answers your question, or if you have follow-up questions.
andyjakubowski commentedon Aug 19, 2021
@tabatkins’s answer helped clarify my understanding. I think I get it now. Thanks for double checking, though, @fantasai 🙂