Bug 246283 - The size of <img> with `contain:size` and css `aspect-ratio`
Summary: The size of <img> with `contain:size` and css `aspect-ratio`
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: CSS (show other bugs)
Version: WebKit Nightly Build
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Nobody
URL:
Keywords: BrowserCompat, InRadar
Depends on:
Blocks:
 
Reported: 2022-10-10 10:57 PDT by cathiechen
Modified: 2023-06-06 02:13 PDT (History)
3 users (show)

See Also:

Attachments
test-case.html (128 bytes, text/html)
2022-10-10 10:57 PDT, cathiechen 		no flags Details
View All Add an attachment (proposed patch, testcase, etc.)

Note You need to log in before you can comment on or make changes to this bug.
Description cathiechen 2022-10-10 10:57:59 PDT 
Created attachment 462909 [details]
test-case.html

```
<img style="contain: size; aspect-ratio: 90 / 53;" src="https://www.w3.org/2008/site/images/logo-w3c-mobile-lg">
```

See the test above, when an `<img>` with contain and aspect-ratio, what size it should have?

Chromium and Gecko: 0 x 0.
WebKit: container width x height, respects to the value of CSS aspect-ratio.

Not quite sure which one is correct, need to dig into the specifications.

[1] https://w3c.github.io/csswg-drafts/css-contain-2/#containment-size
[2] https://w3c.github.io/csswg-drafts/css-sizing-4/#preferred-aspect-ratio
Comment 1 cathiechen 2022-10-11 05:51:45 PDT 
It also causes failures in:
imported/w3c/web-platform-tests/css/css-sizing/contain-intrinsic-size/contain-intrinsic-size-logical-003.html
Comment 2 Radar WebKit Bug Importer 2022-10-17 10:58:17 PDT 
<rdar://problem/101254198>
Comment 3 Oriol Brufau 2022-10-19 10:09:39 PDT 
See https://drafts.csswg.org/css-contain/#size-containment

> Replaced elements must be treated as having a natural width and height of 0 and no natural aspect ratio.

'aspect-ratio: 90 / 53' is still obeyed, but if the natural sizes are 0 then I don't think it can have much effect?
Comment 4 cathiechen 2023-06-06 02:13:04 PDT 
Checked this on commit 81d93da03d83c8e0e7d641030972ee2cf7c3c798, Tue May 16 01:30:00 2023, this has been fixed.