Elements are disturbed when keyboard is active.

Question

I recently created a facebook login page it looks as similar to the original but when the keyboard opens top nav bar is decreasing height also my logo is going up and we can see it only when I scroll down but it should be displayed even when typing. What should I do? I want to overcome the problem with keyboard.
https://code.sololearn.com/WW990LZ4wabe/?ref=app

Answer 1

Hi
On your code, you use height on percentage. But if you change it to a fixed value on pixels, it will work

Happy Coding : )

Alex

Answer 2

Thank you Alex But if I use it in pixels the whole code looks different in other devices. What should I do then?

Answer 3

There's this thing called @media on css that you can use to change any value according to the screen width. Here an example

@media screen and(min-width: 300px){

/*Here you put what you want your website to do when the width of the screen is bigger than 300 px*/

}

You can also use max-width instead on min-width.

There are a few things that you should know so I highly recommend you to find more info on Google or watch an YouTube Tutorial cause they're really helpful.

Happy Coding : )

Alex