开发者

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">
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜