Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[css-flexbox-1] Clarify fit-content behavior when the available space in a given axis is indefinite #11414

Open
gitspeaks opened this issue Dec 25, 2024 · 0 comments

Comments

@gitspeaks
Copy link

gitspeaks commented Dec 25, 2024

According to CSS Flexible Box Layout Module, Section 9.4(7):

Determine the hypothetical cross size of each item by performing layout with the used main size and the [cross-axis*] available space, treating [flex item cross-size*] auto as fit-content.

However, according to the CSS Box Sizing Module Level 3, Section 2.1, the fit-content size in a given axis depends on the available space being definite:

If the available space in a given axis is definite, equal to clamp(min-content size, stretch-fit size, max-content size) (i.e. max(min-content size, min(max-content size, stretch-fit size)))

In particular, stretch-fit size is:

Undefined if the available space is indefinite.

and

Calculations involving this size need to specify a fallback behavior for when the available space is indefinite if that happens to be possible.

This raises a question: How should the fit-content value be determined for a flex item in situations where the [cross-axis*] available space is indefinite?

Consider the following scenario:

  • Writing Mode: horizontal-tb
  • Flex Direction: row
  • Flex Container and Flex Items: Both have height: auto.

How should the fit-content size for the cross axis (height) of the flex item be determined?

(*) Added for clarification purposes.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants
@gitspeaks and others