I tend to use this:<\/p>\n
<meta name=\"viewport\" content=\"width=device-width\"><\/code><\/pre>\nAlthough I see this is recommended a lot: <\/p>\n
<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\"><\/code><\/pre>\nThis means that the browser will (probably) render the width of the page at the width of its own screen. So if that screen is 320px wide, the browser window will be 320px wide, rather than way zoomed out and showing 960px (or whatever that device does by default, in lieu of a responsive meta tag).<\/p>\n
Note:<\/strong> don’t<\/a> use a responsive meta tag if your website isn’t specifically designed to be responsive and work well at that size, as it will make the experience worse.<\/p>\n\n\n\nProperty<\/th>\n Description<\/th>\n<\/tr>\n \nwidth<\/td>\n The width of the virtual viewport of the device. <\/td>\n<\/tr>\n \ndevice-width<\/td>\n The physical width of the device’s screen.<\/td>\n<\/tr>\n \nheight<\/td>\n The height of the “virtual viewport<\/em>” of the device.<\/td>\n<\/tr>\n\ndevice-height<\/td>\n The physical height of the device’s screen.<\/td>\n<\/tr>\n \ninitial-scale<\/td>\n The initial zoom when visiting the page. 1.0 does not zoom.<\/td>\n<\/tr>\n \nminimum-scale<\/td>\n The minimum amount the visitor can zoom on the page. 1.0 does not zoom.<\/td>\n<\/tr>\n \nmaximum-scale<\/td>\n The maximum amount the visitor can zoom on the page. 1.0 does not zoom.<\/td>\n<\/tr>\n \nuser-scalable<\/td>\n Allows the device to zoom in and out. Values are yes or no.<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\nIt’s generally recommended that you don’t prevent scaling, as that’s annoying and potentially an accessibility problem.<\/p>\n