treehouse : what would you like to learn today?
Web Design Web Development iOS Development

Floating Footer - how to keep down?

  • Hey all,
    Just getting started with CSS, and this site has been a HUGE help, but I'm running into an issue that I haven't figured out how to correct yet.

    On pages that have enough text in the content area, my footer stays down low, moving with the length of the text, just like it is supposed to do. The problem comes when there is a page with very little text. The floating footer stays with the text area, and is either on top of or behind my sidebars.

    You can view the page here: http://www.robchinn.com/indyfcpug/

    Here is a page showing the problem: http://www.robchinn.com/indyfcpug/reviews.html

    I have one idea (set up another stylesheet for pages with little text, and increase the margin-top on the footer), but I'm sure there has to be a better way, and I'm willing to bet one of you know how!

    Thanks for the help!
  • I think the simple solution is to give a minimum-height to the main div.

    So try this:

    #content {
    min-height:500px;
    height: auto !important;
    height: 500px;
    }

    This will turn the minimum-height of your content box to 500px, so it will always be at least 500px high.
  • Edwin,

    Thanks so much for the quick response! Worked perfectly.

    One question though - after specifying height: auto, do you need height:500px? Just curious.

    Rob
  • Yep, you need that too, that's for IE 6 and below. More info here:

    http://www.dustindiaz.com/min-height-fast-hack/
  • In good browsers "min-height: 500px;" would be enough, but as you probably allready know, ie6 isn't that good browser and often you need to fix things for it. And because of there are still many people using ie6, better don't ignore ie6 ;)
  • Thanks for the explanation. I left it out, so I guess I'll put it back in, even though we don't get any traffic from IE6 (we are a mac user group after all).

    Thanks for all the help and the great site/forums. I'm sure I'll be spending a lot of time here (the screencasts are great Chris) as I get up to speed with CSS.

    Rob