I am creating a mobile web page that is basically a big form with several text inputs.
However (at least on my Android cellphone), every time I click on some input the whole page zooms there, obscuring the rest of the page. Is there some HTML or CSS command to disable this kind of zoom on moble web pages?
Giving a meta tag attribute "user-scalable=no" will restrict the user from zooming elsewhere. Prevent zooming all together by adding this meta tag to your head tag. This tells the mobile browser to use the same width scale and will not allow the user to zoom in at all, hence also disables that annoying behavior.
We can use the <meta> tag to disable zoom in and out on a mobile web page.
Solution 1Set the window and body to a size that fills the screen-space, without exceeding it. This is why so many people have success with forcing input text-size to 16px; once you do that, its clear that you're WAY zoomed out.
This should be everything you need:
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With