Viewport meta for android default browser

Question

I'm trying to display an image (320x480px) in a webpage on android. I'm trying to configure the viewport meta cause I want the image displayed in full screen.

Actually I simply configured the viewport like that

<meta name="viewport" content="width=320px" />

and it's working perfectly, except with the android default browser. I tried Chrome, Opera and Firefox, and they all display the image correctly.

Regarding this post Full webpage and disabled zoom viewport meta tag for all mobile browsers I tried to configure it in this way without success :

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

or

<meta name="viewport" content="initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,width=320,height=device-height,target-densitydpi=device-dpi,user-scalable=yes" />

Do you have any idea on how to configure the viewport correctly ?

Thank You

Answer 1

<meta name="viewport" content="user-scalable=no, width=device-width">

user-scalable - controls wither the user can "pinch-to-zoom".

width - the width of the viewport.

All of the attributes require integer values, NOT floating point values.

In other words, 1 and not 1.0. Or you could use percentage.

There is no point in setting min and max scaling attributes to the same value. Also, initial-scale is known to cause problems in iOS if set to 1.