iPhone Meta Tag for Viewport, Maintaining Scale on Orientation Change by Chris Coyier

The most useful advice on developing web pages for iPhone I’ve ever come across! Thanks, Chris! Be sure to read Chris Coyier’s blog regularly!

iPhone Meta Tag for Viewport, Maintaining Scale on Orientation Change | Chris Coyier

I was googling around trying to find something on this today and there is lots of advice for setting the iPhone viewport like this:

<meta name="viewport" content="width=320">

That’s fine and dandy for when the iPhone is vertical, but when you flip it, the screen kind of “zooms in” to make 320 pixels into 480 and it looks like shit. Some more experimenting and googling around it it looks like this is the best way to go for keeping things consistent on an orientation change on the iPhone.

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;">

Advertisements

~ by WPA Staff on February 24, 2011.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

 
%d bloggers like this: