There are many screen resolutions in browsers nowadays, so using px
in my CSS sizes isn't actually a good idea. I adopted and used vh
in substitution for px
since it is based on the current viewport's size and then adjust textbox/img/div or anything that has a size: ...vh;
This is actually good but somehow when I try to tap on the textboxes and then the keyboard appears, the stuffs resizes and shrinks down from this:
To this:
This somehow never happens on iOS, only on Android phones. (It's probably with Android's keyboard popping out and taking out real-space from the browser)
Is there someway to fix this, if not, is there anyway that I can adjust my textboxes/divs that'll still be responsive to any mobile resolutions? Thanks!