[css-sizing-4] should contain-intrinsic-size affect the aspect ratio of a replaced element?

[cbiesinger]

https://drafts.csswg.org/css-sizing-4/#intrinsic-size-override

If this property is specified on a replaced element, should that change the aspect-ratio of that element? E.g. should img { contain: size; contain-intrinsic-size: 100px 200px; } imply aspect-ratio: 100/200;?

(And if yes, should that only for replaced elements that have an intrinsic aspect-ratio or also for others, e.g. iframe?)

ref https://crbug.com/1091331

cc @fantasai

[fantasai]

No, because not all replaced elements have aspect ratios. (E.g. IFRAMEs and certain SVGs don't.)

[cbiesinger]

OK. So it shouldn't affect the aspect ratio on an <img> either?

(cc @chrishtr fyi)

[chrishtr]

What do you mean by iframes ans SVG not having aspect ratios? Won't the aspect-ratio property apply to them?

[fantasai]

To summarize, @cbiesinger’s proposal is that if an element has an intrinsic aspect ratio that is defined to be derived from its intrinsic sizes, then changing that intrinsic size via contain-intrinsic-size should also change its intrinsic aspect ratio accordingly.

[fantasai]

I don't have a particularly strong opinion one way or another, but imho contain-intrinsic-size should not effect an aspect ratio where one doesn't exist otherwise.

[fantasai]

Might be a bit confusing if setting contain-intrinsic-size on an IMG or OBJECT does not create or affect the aspect ratio while an image is not loaded, but suddenly has an effect once the image loads and is known to be a PNG, though.

[cbiesinger]

In thinking about it as I wrote an email, I realized that whether the image is loaded can not affect the behavior, since contain:size is defined to be unaffected by the contents. Even today, I think (but didn't verify) we don't use the aspect ratio for an img with contain:size (the only time where contain-intrinsic-size is used).

This does leave the question of whether <img src=foo style="contain: size; contain-intrinsic-size: 100px 100px; width: 50px;"> should use the ratio from c-i-s.

[fantasai]

We wouldn't derive an aspect-ratio from c-i-s on an IFRAME, so I don't think we should be doing so for IMG either. Also consider OBJECT, which is more ambiguous about whether it should typically have an intrinsic aspect ratio.

Bitmap images intrinsically have an aspect ratio. The IMG element doesn't.

And c-i-s shouldn't introduce an aspect-ratio or not depending magically on what HTML element it's specified on.

[tabatkins]

Hm, I feel like we should differentiate between "having two intrinsic dimensions implies the third" elements like img and "each intrinsic dimension is independent and implies nothing about the others" elements like iframe; an img with c-i-s should implicitly override its intrinsic aspect ratio as well, I think?

[cbiesinger]

So I basically want to withdraw my suggestion since with contain: size, everything should basically act as if there is no intrinsic aspect ratio. And since that's the only time when contain-intrinsic-size is used, it probably doesn't make sense for that to now add an aspect ratio.