CSS3 image-orientation

CSS property used generally to fix the intended orientation of an image. This can be done using 90 degree increments or based on the image's EXIF data using the "from-image" value.

W3C Candidate Recommendation: https://www.w3.org/TR/css-images-3/#the-image-orientation

Usage: 93.9% + 0.39% = 94.3%

Support summary

Notes

Opening the image in a new tab in Chrome results in the image shown in the orientation according to the EXIF data.

  1. Partial support in iOS refers to the browser using EXIF data by default, though it does not actually support the property.
  2. Has a bug where the browser is not maintaining the image’s aspect ratio when `object-fit: cover` and `image-orientation: from-image` are used together.

Links

Full support table

IE

5.567891011
nnnnnnn

Edge

121314151617187980818384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149
nnnnnnnnnyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyy

Firefox

233.53.6456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154
nnnnnnnnnnnnnnnnnnnnnnnnnnyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyy

Chrome

4567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152
nnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyy

Safari

3.13.2455.166.177.1899.11010.11111.11212.11313.11414.11515.115.2-15.315.415.515.616.016.116.216.316.416.516.617.017.117.217.317.417.517.618.018.118.218.318.418.5-18.726.026.126.226.326.426.527TP
nnnnnnnnnnnnnnnnnnnyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyy

Opera

99.5-9.610.0-10.110.510.61111.111.511.61212.11516171819202122232425262728293031323334353637383940414243444546474849505152535455565758606263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127131
nnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnnyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyy

Safari on iOS

3.24.0-4.14.2-4.35.0-5.16.0-6.17.0-7.188.1-8.49.0-9.29.310.0-10.210.311.0-11.211.3-11.412.0-12.112.2-12.513.0-13.113.213.313.4-13.714.0-14.414.5-14.815.0-15.115.2-15.315.415.515.6-15.816.016.116.216.316.416.516.6-16.717.017.117.217.317.417.517.6-17.718.018.118.218.318.418.5-18.726.026.126.226.326.426.5
aaaaaaaaaaaaaaaaaaayyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyy

Opera Mini

all
n

Android Browser

2.12.22.3344.14.2-4.34.44.4.3-4.4.4149
nnnnnnnnny

Blackberry Browser

710
nn

Opera Mobile

101111.111.51212.180
nnnnnny

Chrome for Android

149
y

Firefox for Android

151
y

IE Mobile

1011
nn

UC Browser for Android

15.5
y

Samsung Internet

45.0-5.46.2-6.47.2-7.48.29.210.111.1-11.212.013.014.015.016.017.018.019.02021222324252627282930
nnnnnnnnnyyyyyyyyyyyyyyyyyy

QQ Browser

14.9
n

Baidu Browser

13.52
y

KaiOS Browser

2.53.0-3.1
yy

Back to list

Data copyright caniuse.com