Simple css question - sticky footers, etc.

Question

So I used the example for sticky footers from: http://ryanfait.com/sticky-footer/

It worked great, except for one thing - when content in my main div gets too long, it overlaps the footer, rather than pushing it down the page.

Any suggestions?

Thanks! Elliot

Answer 1

They are using margin-bottom:-142px on .wrapper, and .footer is 142px high, so no matter how big the .wrapper is, it will always have empty 142px at the bottom which will be then filled with .footer.

Answer 2

it is happened because there is negative margin:

.wrapper  {
font-size:0.9em;
margin:0 auto -142px;

In you case, may be you forgot about element .push. It should be empty in the .wrapper

< div class="push" >< / div >

Or may be you set z-index for .wrapper