For a while now, I have been puzzled by the fact that Mobile Safari, the iOS version of Safari, opened any page on my web site at a much larger width than the CSS value for the main content area (570px).
It turns out, there are a number of Apple-Specific Meta Tags that can be used to provide background information for your web page, like how to scale it, or providing scaling limits.
To set the initial scaling of a window when presented on the iPhone or iPad, there is the
viewport meta tag. If missing, a default width of 960 pixels will be used, or more if the web content is wider. Setting it to 590 pixels, thus adding a 10 pixel padding, works just fine for my particular case:
<meta name="viewport" content="width:590px">