mobile keyboard resize viewport
No <meta name='viewport'/>
or percentage fixes worked in my case (Android 2.3 browser), so I ended up with this CSS:
body {
min-height: 350px;
}
You also need to do this for anything with height:auto
.
It's a hack, but it at least makes the website usable in this edge case. As soon as the user tries to zoom, it snaps out of it.
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
Try this piece of html. I'm using it for every of my pages and it always did what it should. Maybe yours isn't working because of the missing minimum-scale attribute.