The Lodge is members-only design/dev videos and Office Hours.

Next Office Hours Session: "Programming Fundamentals" Dec 02 - 2:00 PM Eastern

Footer has a white border and wont stay at bottom of page!

  • # August 16, 2009 at 9:37 am

    I’m working on my second and third websites simultaneously and am having an annoying footer problem on one. It’s adding a white boarder/gap on the right and left side of my footer and it is also not sticking to the bottom of the page. I’ve tried a few things I’ve found on here but haven’t had any luck fixing the problems! Any help would be fantastic.

    Here is the page so far…

    Thanks a bunch,

    # August 16, 2009 at 12:53 pm

    This reply has been reported for inappropriate content.

    Adding margin:0; to the body will get rid of the white border.

    As for making it stick to the bottom, the old favourite is and here is a more up to date one

    # August 16, 2009 at 6:12 pm

    The first thing for the margin worked great. Still having problems with the footer sticking to the bottom of the page. I’ve got all the code in there and no luck… did I miss something somewhere??

    Thanks Again!

    # August 16, 2009 at 10:48 pm

    This reply has been reported for inappropriate content.

    Get rid of the padding on #main, #footer and on #footer p make the 150px just top-padding, then on img.img make the bottom margin 17px.

    # August 17, 2009 at 9:07 am

    You’re my new hero! I would never have figured out I needed to change the img.img If you don’t mind explaining, why did that have to change? And why did the padding on #main and #footer need to go away? Still trying to grasp these concepts. At least I know it seems to be working now!
    Thanks a bunch!

    # August 17, 2009 at 9:42 am

    This reply has been reported for inappropriate content.

    I just went through the page with firebug to see what was holding the footer off the bottom, turned out it was all that padding.
    As for the bottom margin on img.img, if you put it back to what it was before (10px?) you will see that the footer was overlapping the bottom of the content text, I just used that margin to push it down a little bit.

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed