how do I fill a footer section all the way to the bottom

Question

I would like to keep my footer on the bottom on http://quaaoutlodge.com/drupal-7.14/test but also on http://quaaoutlodge.com/drupal-7.14/ (it should stay the way it is, here) so I followed this link http://matthewjamestaylor.com/blog/keeping-footers-at-the-bottom-of-the-page found on How do I get ‘footer’ content on a master page to push down when main content doesn't fill a page now the problem is, if i set position to absolute and bottom to 0px, the footer always stays at that position but i only want it that way if the content is so little that it lifts the footer up from the bottom. Any help is appreciated! Thank you! Ron

Anyone? Thanks!

Have you considered setting a minimum height to the div containing your content? You can just use javascript to get the height of the window on page load and on page resize and just subtract the height of your footer and header. — Liftoff, Oct 10 '12 at 04:15

score 2 · Answer 1 · answered Oct 10 '12 at 06:28

2

You should set for footer this style

position:fixed;
bottom:0;
left:0;
z-index:10;

and for parent element set

position:relative;

best regards

answered Oct 10 '12 at 06:28

Saeed

I tried that but it doesn't seem to work: http://quaaoutlodge.com/drupal-7.14/test the footer stays on top (similart to position:absolute) – stdcerr Oct 10 '12 at 14:33

score 1 · Answer 2 · answered Oct 10 '12 at 04:12

1

This is how I accomplish a "Sticky Footer" that works in every browser I can think of: http://ryanfait.com/resources/footer-stick-to-bottom-of-page/

Hope this helps!

answered Oct 10 '12 at 04:12

Bob

This is a pretty good solution, it looks like. My only concern is the [non-semantic](http://en.wikipedia.org/wiki/Semantic_Web) `.push` `div`. This is generally a minor concern, but it'd be interesting to see if a completely semantic version exists. – jamesplease Oct 10 '12 at 04:34

2 Answers2