noobcode noobcode - 1 year ago 89
CSS Question

CSS using negative relative positioning issue

I have a header, mainbody and footer. Header and mainbody are properly styled. Now for footer I want to make it appear behind mainbody, so I used:

z-index: -1;
position: relative;
top: -60px;

This gives the desired result, but I get an extra space of 60px at the bottom.

How do I clear this extra space?

Answer Source

Paul is correct. margin-top: -60px; instead of top: -60px;. Another possible solution would be to set the "mainbody" to position: relative; then to use position: absolute; bottom: 60px; on the footer - although this woild mean the footer needs to be moved inside "mainbody". though as long as the parent of footer flows with "mainbody" you could use this same trick on that element instead.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download