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?
Since Chrome 81, image EXIF orientation is respected by default. Latest Safari (13.1 as of now) is also working correctly.
Firefox hasn't fully implemented this (see Bugzilla issue #1616169).
Here's a couple test pages I found:
As for the standard, the image-orientation property is now marked deprecated on the latest CSS Images Level 3 spec draft:
'image-orientation'
This property is deprecated, and is optional for implementations.
From the latest update of chromium/chrome version 81, it will support exif orientation from image itself. This means that the exif orientation when present in an image, will be used to orient the image unless the "image-orientation: none" CSS property is present.
Before this update, you may used any other work around to rotate images or manually rotate based on the known image orientation. Then the newer chrome 81 will automatically rotate the image. If you need to avoid the automatic rotation and continue with the same work around option used for older chrome , you may need to set image-orientation: none, because now the image-orientation value is from-image by default.
Use https://github.com/blueimp/JavaScript-Load-Image
It includes a demo index.html file that can load an image and display it correctly with the correct rotation applied.
