I’m using Ryan Fait’s sticky footer, but the glue I’m applying doesn’t appear to be sticky enough.
width:928px; margin: 0 auto; height: 250px;
background: white; border-top: 4px solid #333333;
My footer.php looks like this:
I added height: 100%; to the html tag and suddenly it almost works.
The footer gets pushed down a little bit too far, resulting in a vertical scrollbar appearing. See for yourself here.
My margin on the wrapper div is -50px, push is 50px and footer height is 50px.
I cleaned my code thoroughly and replaced all margins with padding, I have no clue why the footer is pushed down too far.
I got rid of the scrollbar by reducing the height of the footer to 26px – then it all works perfectly, but I’m really not sure what will happen when I keep adding elements to my page. I would like it to work how it is supposed to, so that I don’t have to change the footer height all the time.
Please help :).
footer height = 50px, footer padding-top = 20px, 50px + 20px = 70px. There’s your problem.
Take the padding off the footer and put it on #footer p where it belongs.
Ah finally!. Thanks you so much apostrophe.
I had tried removing that padding earlier, that must of been before I added the 100% height to the html, never crossed my mind to try it again. Cheers!
The border is what pushes it down another 4px, I’ll have to add that to the push & margin.
Solved finally :mrgreen:. Webdesign is so much fun when things work!
You must be logged in to reply to this topic.
*May or may not contain any actual "CSS" or "Tricks".