HTML / CSS: How to make the content follow the footer?

views:

answers:

HTML / CSS: How to make the content follow the footer?

My problem is that I need a footer which is always on the bottom, even if the page scrolls etc.. but I don't know how to make the content follow the footer.

Please see the example given, this is a very similar layout, I have a sidebar also, but you can see with firebug, or something like that, that the body div is not following the footer.

Example: Click for demo

+2 A:

Have you thought about using the jQuery Sticky Footer found at http://css-tricks.com

http://css-tricks.com/snippets/jquery/jquery-sticky-footer/
http://css-tricks.com/examples/jQueryStickyFooter/

rockinthesixstring 2010-07-13 04:36:05

the content is still remains the same, the question is not about the footer, it's about the content part, I don't want to have empty area between the content and the footer.

CIRK 2010-07-13 04:53:31

then sorry I don't follow. If your footer is simply to be at the bottom of the content without sticking to the bottom of the page, then simply implement a footer div that comes after the content div... it shouldn't be that hard. The harder option is to always have the footer stuck to the bottom of the page.

rockinthesixstring 2010-07-13 04:57:40

I need both in the same time.

CIRK 2010-07-13 05:22:25

Both options are not possible. The footer will either follow the content by default. Or using some trickery like the sticky footers option, it'll always be stuck to the bottom of the body.

Jonny Haynes 2010-07-13 07:12:41

I disagree with Mr. Haynes. Using javascript, one can set it up to remain fixed at the bottom if content has *not* reached its end, and when it reaches its end, 'release' the footer to follow the content up the page. The coding would take a little bit of work, and I'm not sure it would add value (seems like leaving the footer stuck to the bottom of the screen would be fine), but then, that's not really my decision, but whoever is designing the site.

Scott 2010-07-13 15:05:18

+1 A:

You could make it withJavascript + CSS.

With CSS you could put the footer to the bottom of the page, and with javascript your could specify the height of the page and modify the height of your content.

GGF 2010-07-18 13:44:38

I've answered a similiar question before, you might want to check it out:

http://stackoverflow.com/questions/1347366/div-at-bottom-of-window-and-adaptable-height-div/1347402#1347402

Sinan Y. 2010-07-18 13:46:59

ansaurus

tags:

views:

answers:

HTML / CSS: How to make the content follow the footer?

related questions