Image Help needed - should I rotate or what for mobile?

[revdave]

Hi all,

I am trying to create a simple page that displays one image on Mobile phones.

This image is landscape and roughly: width="600" height="240"

If I add an image tag like:

<img src="mypic.jpg" width="600" height="241" alt=""/>

portrait view...

it shows up too wide in portrait view - so you have to scroll left and right to see all of it. (not that great)

landscape view...

if you rotate the phone to landscape - it is just about full screen in landscape view. This is basically what I want.

Also it's upright in both views.

I am wondering if I can can set it up to start as already rotated in portrait mode which should encourage people to try to rotate their phone to see the better view.

I tried transform: rotate(90deg) but couldn't get it to show correctly (odd size - not left alight etc.)

Is there a good way to set this up?

[BenPleysier]

The only way to show an image in different clients and rotations is to apply relative widths and or heights. Have a look at How To Create Responsive Images

As far as forcing the image to be rotated in mobiles, this is counteractive. Mobile users know to turn their devices to get the best view for portrait aligned images.