Skip to content

[css-flexbox-1] When can available space for flex items be infinite? #6476

Closed
@andyjakubowski

Description

@andyjakubowski

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-size computes to auto, and the flex container participates in flow layout
  • flex container block-size computes to a <percentage>, and the containing block’s block-size depends on content; this creates a cyclic dependency, so <percentage> behaves as auto

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?

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions