CODEWITHSUNDEEP
iphonehtmlweb-applicationsiphone-4metatag
pop850
pop850

Reputation: 3157

iPhone 4 ignoring viewport meta tag

I have just added the following HTML to the <head> section of my iPhone web app:

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=no;"/>

This (supposedly) limits the zoom of the page so the user can't zoom in. On iOS versions prior to 4.0, this tag is respected - but iOS versions 4.0+ completely ignore it, and lets you zoom in all you want. Furthermore, if you rotate, iPhone 4 will weirdly zoom in automatically.

So what I'm asking is, How can I "lock" the zoom for my app? Can anyone point me in the right direction?

Upvotes: 1

Views: 4534

Answers (2)

lemp
lemp

Reputation: 68

If you have Zoom enabled in the Accessibility settings (inside General), Safari seems to ignore the viewport meta (tested only on iPhone 4 on iOs 4).

You need to reload your page after changing the setting.

Upvotes: 1

Sam
Sam

Reputation: 11

typo? use comma.

try this: <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>

Also, why use maximum-scale if you want the viewport to be fixed? If you use "width=device-width", the viewport will be different between iphone3 and iphone4.

You may try this one too: <meta name="viewport" content="width = (your page width), user-scalable = no"/>

please replace (your page width) with your site's width.

Upvotes: 1

Related Questions