Fixed web page width for mobile devices
Question
I've been working on a responsive design. To stop the content from crossing boundaries i've used viewpoint meta tag with width = 480 . The problem is i want my website to load with minimum of 480px no matter what. If the screen width is less than 480px I want it to fit the screen width by "Zooming out".
I've used the following viewpoint meta tag:
<meta name="viewport" content="width=480px, initial-scale=1, maximum-scale=1" />
I've also used min-width css tag to specify minimum width.
<body style="min-width: 480px; width:100%; margin:auto;">
So after all this when i tried to load the website in DevTools Emulator (Google Chrome), it shows a horizontal scrollbar. Got any ideas on how to do it.
1 answers
solution1
1 ACCPTED 2014-01-28 19:36:39
Have you tried width=device-width ?
I don't think forcing the 480px in the meta will do what you want (not crossing media-query-type boundries).
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.