[csswg-drafts] [css-sizing] Resolved size of min size properties doesn't round-trip (#11716)

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

== [css-sizing] Resolved size of min size properties doesn't round-trip ==
```html
<!DOCTYPE html>
<button>Click me</button>
<div id="target" style="width: 100px; aspect-ratio: 1; border: solid">
  <div style="height: 200px"></div>
</div>
<script>
var target = document.getElementById("target");
document.querySelector("button").addEventListener("click", () => {
  target.style.minHeight = getComputedStyle(target).minHeight;
});
</script>
```

There is interoperability among Gecko, Blink and WebKit: the resolved value of `min-height` doesn't round-trip. Awful.

This is because of CSS Sizing 3: https://drafts.csswg.org/css-sizing-3/#valdef-width-auto

> For backwards-compatibility, the [resolved value](https://drafts.csswg.org/cssom-1/#resolved-value) of this keyword is zero for boxes of all [[CSS2]](https://drafts.csswg.org/css-sizing-3/#biblio-css2) [display types](https://drafts.csswg.org/css-display-4/#display-type): block and inline boxes, inline blocks, and all the table layout boxes. It also resolves to zero when no box is generated.

This was fine because `min-height: auto` used to behave as zero. But CSS Sizing went and changed that, without taking care of the resolved value: https://drafts.csswg.org/css-sizing-4/#aspect-ratio-minimum

> In order to avoid unintentional overflow, 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).

Hopefully it's not too late to change.

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/11716 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 21:37:31 UTC