Viewport meta tag not working in iPhone and Android

android iphone html meta-tags viewport

Prabhat · May 28, 2012 · Viewed 48.3k times · Source

I am using the following html code

<!DOCTYPE HTML>
  <html>
    <head>
     <title>test</title>
      <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
      <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    </head>
    <body>
    test
    </body>
  </html>

My intention is to prevent user from zooming in or out. The above code isn't working in iPhone and Android. Any solution ?

EDIT: It appears in iPhone settings, if Zoom is selected as On under Settings>Accessibility>Zoom, then this will override meta tag. Source

Not sure why it is happening in android.

Answer

I use this tag to prevent zoom on all mobile platforms :

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, target-densityDpi=device-dpi" />

With , and not ;

Viewport meta tag not working in iPhone and Android

Answer

Related questions