ansaurus

Question

Answer 1

+2 A:

Let's assume your website is wrapped in a container called #wrapper.

We can set the width to 100%, and only allow it a maximum value of 480px. Like so:

#wrapper {
    width: 100%;
    max-width: 480px;
}

You can also listen to the event that fires when the iPhone's orientation changes, i.e. when you flip the phone.

In HTML

<body onorientationchange="someFunction()">

OR In Javascript

window.onorientationchange = someFunction;

Marko 2010-08-09 10:30:39

Great solution!

Tom Gullen 2010-08-09 10:32:37

Answer 2

+1 A:

width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0

gustavogb 2010-08-09 10:43:14

Thanks @gustavogb, maximum-scale=1.0 sorted it!

WDuffy 2010-08-09 10:50:38