CODEWITHSUNDEEP
htmlcssfixed
Vlad Levchenko
Vlad Levchenko

Reputation: 301

Fixed position div on top vertical space

My situation is that I have fixed position div with percented height at the bottom of page that is on top of it(see picture). The issue is that when I scroll page to the end, some of its content is hidden beneath this div. I think I should add empty element at the bottom of page, but what is the best way to do it? enter image description here

Upvotes: 3

Views: 695

Answers (1)

Liglo App
Liglo App

Reputation: 3819

A nice solution could be to change the height of the fixed div to be expressed in vh not in % (see), for example:

div.fixed-at-bottom { height: 20vh; .... }

and then set a margin-bottom to your contents div with the same value (or a little more to get more space):

div.content { margin-bottom: 22vh; .... }

I created a jsfiddle to present that.

Upvotes: 1

Related Questions