Dear Lazyweb,

Let me try a simpler question than my last.

I have a document with
<meta name="viewport" content="width=device-width">
When I view this document on an iPhone in portrait-mode, the size of my window.innerWidth/Height is 320x356, as expected.

When I rotate the phone into landscape, I expect to get 480x208, but instead I get 320x179, scaled up (meaning my apparent font size has increased).

What do I do to make it so that when I rotate, I get a 480-wide viewport, and a font that is the same apparent size as before?

Setting initial-scale=1.0 doesn't do it unless I zoom out and hit reload after rotating.

Setting maximum-scale=1.0 makes it do what I expect, but disables pinch-zooming entirely, so that's no good.

I don't understand what -webkit-text-size-adjust:none is supposed to do, but it doesn't seem to be relevant here, and doesn't change anything.