iPhone text resizing between portrait and landscape
I am testing a mobile site with 2 iPhones. When I rotate 1 into landscape mode, the text resizes (desired). When I rotate the other into landscape mode, the text does not resize (not desired)
I have tried using the -webkit-text-size-adjust style, but the same behavior occurs
html, body, p, div, h1, h2, h3, h4, h5, h6 {
-webkit-text-size-adjust:none;
}
My head tag
<head>
<meta charset="utf-8">
<title>Site</title>
<meta name="HandheldFriendly" content="True">
<meta name="MobileOptimized" content="320"/>
<meta name="viewport" content="width=d开发者_StackOverflow社区evice-width, maximum-scale=1.0, minimum-scale=1.0">
<link rel="stylesheet" href="style.css">
</head>
Is there some setting that can be changed to always resize text? Should I revisit my meta info for mobile?
Edit:
iPhone1 = iPhone 4 Verizon running iOS 4.2.6
iPhone2 = iPhone 4 AT&T running iOS 4.3.5
Thanks
device-width always refers to width in portrait mode, so width=device-width will scale the viewport in landscape mode. This is a quirk of the iPhone (and I think iPad too). Seems a bit dumb, but this is how apple have done it.
So just use:
<meta name="viewport" content="maximum-scale=1.0, minimum-scale=1.0">
Or better this, which will still allow the user to scale if they want to:
<meta name="viewport" content="initial-scale=1.0">
加载中,请稍侯......
精彩评论