[csswg-drafts] [css-images-3] clarify which images image-orientation applies to (#5245)

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

== [css-images-3] clarify which images image-orientation applies to ==
In #4165 it was resolved that EXIF orientation applies to all images by default. There was some discussion about which images the `image-orientation` property and talk of a resolution, but no actual resolution.

This matters because we've got two sets of WPT tests added in the last six months which disagree - see https://github.com/web-platform-tests/wpt/issues/18549#issuecomment-645532399 - and different results from Firefox and Chrome (see [a](http://wpt.live/css/css-images/image-orientation/image-orientation-background-image.html), [b](http://wpt.live/css/css-images/image-orientation/image-orientation-none-content-images.html)). So we need a once-and-for-all resolution on this.

@heycam made the same observation in https://github.com/w3c/csswg-drafts/issues/4165#issuecomment-587949977, and we'd like to implement this but can't until it's clarified.

So the question is: does the `image-orientation` property apply to "decorative" images, such as `background-image` and `border-image`? And if it does not (as currently specified), the second question is can we tightly define "decorative" images.

@zcorpan made a full list at https://github.com/web-platform-tests/wpt/issues/18549#issuecomment-522631537

> CSS
> * ::before/::after + content
> * background-image
> * list-style-image
> * border-image
> * cursor
>
> SVG
> * image
>
> HTML
> * img
> * canvas drawImage() + getImageData()
> * video poster
> * input type=image
> * embed
> * object
>
> load an image in an iframe
> load an image in a top-level doc (this already respects EXIF in all browsers I believe)
> Favicon link rel=icon / favicon.ico (manual tests?)
> web app manifest icon (manual test?)

* I would expect "content" images to be those displayed from `content`, `list-style-image` (which generates content), SVG `image`, HTML`img`, `embed`, `object`, and `video` poster. The `image-orientation` property should apply to all of these.
* I would expect "decorative" images to be `background-image`, `border-image` and `mask-image`.
* `image-orientation` does not apply to cursor, top-level docs, favicon or web-app manifests. 
* I'm slightly unsure about exactly where iframe fits.

cc @schenney-chromium

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

Received on Friday, 19 June 2020 09:54:16 UTC