1886745 - object-fit is broken for elements with contain: size

Status: RESOLVED FIXED

(Core :: Layout: Images, Video, and HTML Frames, defect)

Description

[Simon Pieters [:zcorpan]]

See https://github.com/whatwg/html/issues/10079#issuecomment-2010809133

object-fit doesn't work with contain: size. Demo: https://codepen.io/eeeps/pen/dyLNEdN

From the spec issue, it's not clear if we want to use the aspect ratio from the image data, as in img.naturalWidth/img.naturalHeight or use contain-intrinsic-size. But right now we just stretch the image.

Comment 1

[Simon Pieters [:zcorpan]]

Also see https://github.com/w3c/csswg-drafts/issues/7519#issuecomment-1202721367

Comment 2

[Daniel Holbert [:dholbert]]

This issue (on today's CSSWG agenda) seems related, too: https://github.com/w3c/csswg-drafts/issues/10116

Comment 4

[Emilio Cobos Álvarez (:emilio)]

Attachment: Bug 1886745 - Ignore containment for object-fit computation. r=dholbert,#layout

We were already doing the right thing for canvas/video.

Comment 5

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/685ef9cd0166
Ignore containment for object-fit computation. r=dholbert,layout-reviewers

Comment 6

[Sandor Molnar[:smolnar]]

https://hg.mozilla.org/mozilla-central/rev/685ef9cd0166

Comment 7

[BugBot [:suhaib / :marco/ :calixte]]

The patch landed in nightly and beta is affected.
:emilio, is this bug important enough to require an uplift?

• If yes, please nominate the patch for beta approval.
• If no, please set status-firefox127 to wontfix.

For more information, please visit BugBot documentation.