Keyboard pushes footer up

HTML-CSS
1

I have
.PrimaryNav (header)
.Content Container FixedWidth
HERE IS EMPTY SPACE.
.Footer Container

That is how the whole page looks like.

.Footer.Container has position: fixed; bottom:0px;

The problem is that the keyboard pushes footer up.

I can probably fix that by making .Content.Continer take the rest of the height but I don’t know how.

So I want you to help me (if possible) to make .Content.Container take full height up to footer.

I tried height: 100%; and it does not work.

It’s OKAY for me to have that empty space but I don’t want the keyboard to push my footer. (absolute for footer does not work).

Thank you.

2

try with position: absolute instead of fixed

1 Like
5

I fixed the problem.

I hope this will help others.

Container must be position: relative;
Footer: position: absolute, bottom: 0;