Is there a way to tell browsers to honor the jpeg exif orientation?
I know that the automatic rotation of JPG files is disabled in browsers.
They can not enable it because it would break the layout of some websites.
Is there a CSS property? or javascript code to achieve that? or something else? or maybe the solution to this problem doesn't exist yet?
Answer
CSS image-orientation: from-image
from the specs https://www.w3.org/TR/css4-images/#the-image-orientation
6.2. Orienting an Image on the Page: the ‘image-orientation’ property
image-orientation: from-image
from-image: If the image has an orientation specified in its metadata, such as EXIF, this value computes to the angle that the metadata specifies is necessary to correctly orient the image. If necessary, this angle is then rounded and normalized as described above for an value. If there is no orientation specified in its metadata, this value computes to ‘0deg’.
Matching Chrome-Issue: https://bugs.chromium.org/p/chromium/issues/detail?id=158753
But the browser support is not here yet: https://developer.mozilla.org/en/docs/Web/CSS/image-orientation#Browser_compatibility
Rotate via JS
There is a JS snippet to do this: https://gist.github.com/runeb/c11f864cd7ead969a5f0
My conclusion
I think rotating the image on the server with tools like imagemagick is too much overhead.
The browser can rotate the image, but the web application needs to give the advice how to rotate this explicitly.
This explicit in browser rotation could be done like this: https://stackoverflow.com/a/11832483/633961