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?

回答1:

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.

来源：https://stackoverflow.com/questions/31311323/fixed-position-div-on-top-vertical-space