tags:

views:

49

answers:

2

iphone support "Screen" media type then how to make PC website compatible with iphone screen? While both uses same media type?

I know iphone do not support FLASH but if website has fixed width images, uses of jquery and 960 px fixed width. then how to make compatible with small screen iphone.

A: 

I think what you are asking has to do with the viewport meta tag. Try this.

<meta name="viewport" content="width=220, user-scalable=yes" />

You might also try to adjust the width to best work with your website. But at least this is a good starting point.

meme
A: 

You may want to create a separate stylesheet intended for the iPhone browser, and link to that stylesheet this way:

<link media="only screen and (max-device-width: 480px)" href="iphone.css" type= "text/css" rel="stylesheet">

I've used this technique myself, and it is recommended in Apple's Safari Web Content Guide. Older browsers will ignore the only keyword and won't read your stylesheet.

In that iPhone-specific stylesheet, try including some rules to scale your text and images, and show/hide content until the site displays nicely on the smaller screen.

mattonrails