I have a website that I am trying to make mobile friendly. When I get to my forms though when the textbox is selected the screen zooms in when you're done it does not zoom back out. I do not think this is my CSS that is doing this I have a feeling it involves the way you set up your meta tags. Is there a way I can adjust my meta tags to not do that zoom in since its not zooming out? Or have it at least zoom out once the focus is lost.
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta name="viewport" content="width=device-width, initial-scale=1">
If you wanted to remove zooming on the page altogether, you could try adding user-scalable=0
to your viewport tag, like so;
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0">
But this may not be ideal. From what I can gather, another way to prevent this would be setting the input text of the form in question to be above a certain size, to prevent zooming on the form specifically. For most iOS/mobile devices, that size seems to be around 16px, although this would likely vary between devices.
input {
font-size: 16px;
}