[csswg-drafts] [css-sizing-3] Mapping HTML’s IMG aspect-ratio behavior into CSS. (#4951)

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

== [css-sizing-3] Mapping HTML’s IMG aspect-ratio behavior into CSS. ==
HTML accepted to map the `width` and `height` attributes of the IMG element (and some others) to an aspect ratio for the purpose of rendering in https://github.com/whatwg/html/pull/4952 . Currently this is specified as providing an “intrinsic aspect ratio” until the image loads and is able to provide its own. Since the current `aspect-ratio` property doesn't have a way to indicate "use this value until the element can provide its own", the behavior can't be mapped directly to CSS.

But we do prefer having rendering rules mappable to CSS, so the question is how should we make this possible? The two questions are:

1. What syntax to use to indicate "here's an aspect ratio to use but only until the thing loads and provides its own info"?
2. How do we handle the nuances of `box-sizing`? Currently an explicit aspect ratio (`<ratio>`) uses the specified box, whereas an intrinsic one (`auto`) uses content-box always. Probably the IMG mapping should continue to use content-box always. Is this a function of the above-mentioned syntax, or an extra switch?

Wrt 1, I suggest just allowing the `auto` and `<ratio>` values to be combined. (The current syntax is `auto | <ratio>`, this would make it `auto || <ratio>` with the combined value treating `<ratio>` as fallback only.)

Wrt 2, we could consider one or both of:
- Combining `auto` and `<ratio>` triggers using content-box always.
- Add an optional `box-sizing` keyword into the syntax, e.g. `auto || <ratio> || <visual-box>`.

My inclination is to do both.

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

Received on Wednesday, 15 April 2020 18:27:35 UTC