[csswg-drafts] [css-sizing] Automatic minimum size needs to be capped by definite preferred size (#11719)

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

== [css-sizing] Automatic minimum size needs to be capped by definite preferred size ==
https://drafts.csswg.org/css-sizing-4/#aspect-ratio-minimum

> the [automatic minimum size](https://drafts.csswg.org/css-sizing-3/#automatic-minimum-size) in the [ratio-dependent axis](https://drafts.csswg.org/css-sizing-4/#ratio-dependent-axis) of a box with a [preferred aspect ratio](https://drafts.csswg.org/css-sizing-4/#preferred-aspect-ratio) that is neither a [replaced element](https://drafts.csswg.org/css-display-4/#replaced-element) nor a [scroll container](https://drafts.csswg.org/css-overflow-3/#scroll-container) is its [min-content size](https://drafts.csswg.org/css-sizing-3/#min-content) **capped by its [maximum size](https://drafts.csswg.org/css-sizing-3/#max-width)**.

Capping by a definite max size is not enough, it should also be capped by a definite preferred size.

The reason is simply that the intrinsic size in each axis depends on the other axis, i.e. both axes are ratio-dependent (see #11718), and the automatic minimum size shouldn't force a box to become bigger than its preferred size if it's definite.

But OK, let's pretend that there is a single ratio-dependent axis. Then we need `calc-size()` which is only available in Blink, but:

```html
<!DOCTYPE html>
<div style="height: 100px; aspect-ratio: 1; border: solid; min-width: auto; width: 100px; max-width: calc-size(max-content, 99999px);">
  <div style="width: 200px"></div>
</div>
```

The ratio-dependent axis would be the inline one (via the presence of `max-content` in `max-width`).

But the element is indeed 100px wide, the automatic minimum size doesn't force it to become 200px wide.

And this cannot be explained by the fact that the max-content size is 100px and then the maximum size is capping the automatic minimum size. Because thanks to `calc-size()` the maximum ends up being `99999px`.

So the thing capping the automatic minimum size must be the definite preferred size. Which totally makes sense.

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


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

Received on Friday, 14 February 2025 22:21:42 UTC