5

I have uploaded image from Ipad/Iphone (Captured in Iphone/Ipad). It's showing perfect in Ipad/Iphone browsers, but in desktop all browsers', it's showing 90 degree rotated.

<img> tag is as below, 

<img id="Main_SettingMain_imgPhoto" style="height:100px;width:100px;" src="/Images/UserProfile/test.jpg">

This image is in portrait mode but it displaying in landscape mode in all desktop browsers.

According to this link,

image in html left turn 90 degree automatically issue, i put css but it only allow in mozilla browser. I have to make this <img> tag compatible in all Desktop browsers'.

Any suggestion acceptable.

Community
  • 1
  • 1
Niralee Patel
  • 151
  • 7
  • I referred this link http://stackoverflow.com/questions/4565507/camera-image-changes-orientation and it solved my issue. – Niralee Patel Jun 20 '15 at 04:41

1 Answers1

0

I had encountered this issue while working for one website, The Issue is not with your code its with Image . Because it is captured with Iphone/Ipad.

Use Photoshop to edit Image, and save it in Jpg format or accordingly. It wont Flip on any browser.

It worked for me. Give it a try!

Vinayak
  • 415
  • 3
  • 21
  • Don't Just use the Images captured with Iphone or Ipad as it is, Edit a bit in photoshop or anyother tool and save it again newly in required format. This will work For sure. – Vinayak Jun 13 '15 at 05:08
  • yes but the image uploaded by user and it directly shows in image tag. so i have no choice to alter it with Photoshop – Niralee Patel Jun 13 '15 at 05:26
  • Oh I thought It is static. You can detect the browser with Js and apply -webkit- accordingly – Vinayak Jun 13 '15 at 05:40
  • I already applied -webkit and image-orientation in css but nothing worked – Niralee Patel Jun 13 '15 at 05:45