[csswg-drafts] Should `min-content` really include the width/height of `flex-basis: 0%` scrollable items? (#12182)

benface has just created a new issue for https://github.com/w3c/csswg-drafts:

== Should `min-content` really include the width/height of `flex-basis: 0%` scrollable items? ==
Consider the following [CodePen](https://codepen.io/benface/pen/bNNQoXr) (in Chrome, because it uses `calc-size`).

I want the card's height to be based on its content _and_ on the viewport's height, in a way that doesn't seem possible:

1. The card should never be taller than its content's height (which I assume to be `max-content`).
2. The card's height should be allowed to shrink to fit in the viewport, in which case the body section should become scrollable... however, it should never get smaller than its "minimum height" (which I assume to be `min-content`).

To achieve #1, uncomment `max-height: max-content;` – looks like `max-content` is computed correctly, great.

But to achieve #2, the only way I could find was to use `flex-basis: 0` instead of `flex-basis: 0%`, but then `max-content` is the same as `min-content`, and there is no way to size the card based on its content anymore.

I feel like the `min-content` when `flex-basis` is `0%` should be the same as when it is `0`, that is, it shouldn't include the height of the body since it is scrollable (which I imagine should be the same for `overflow: hidden`). That way, it would be possible to satisfy both requirements by using `min-content` in the `min-height`, and `max-content` in the `max-height`.

Hopefully that makes sense!

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/12182 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Monday, 12 May 2025 02:18:44 UTC