Source code
Revision control
Copy as Markdown
Other Tools
Test Info:
- This WPT test may be referenced by the following Test IDs:
- /css/css-images/cross-fade-cross-origin-orientation.sub.html - WPT Dashboard Interop Dashboard
<!DOCTYPE html>
<meta charset="utf-8">
<title>cross-fade() respects orientation for cross-origin images even with image-orientation: none</title>
<link rel="match" href="cross-fade-cross-origin-orientation-ref.html">
<style>
.test {
width: 50px;
height: 100px;
image-orientation: none; /* Should be ignored for cross-origin images */
background-image: cross-fade(100% url("http://{{host}}:{{ports[http][1]}}/css/css-images/image-orientation/support/exif-orientation-6-ru.jpg"), 0% #fff);
![http://{{host}}:{{ports[http][1]}}/css/css-images/image-orientation/support/exif-orientation-6-ru.jpg](http://{{host}}:{{ports[http][1]}}/css/css-images/image-orientation/support/exif-orientation-6-ru.jpg){kind=link}
background-size: 100% 100%;
background-repeat: no-repeat;
}
</style>
<p>The image below should be rotated (50x100) because it is cross-origin, despite image-orientation: none.</p>
<div class="test"></div>