Help with footer background image [duplicate]

This question already has answers here: Closed 11 years ago.

Possible Duplicate:

How do you get t开发者_高级运维he footer to stay at the bottom of a Web page?

The 2nd background image on this page isn't properly positioned... I'm struggling to come up with a fix... I need the footer to be at the bottom of the page, always. min-height doesn't work because I need it to always remain at the bottom regardless of their resolution.

Is there a CSS fix for this?

-URL REMOVED-

---

Sounds like you are looking for a sticky footer.

http://ryanfait.com/sticky-footer/

* {
    margin: 0;
}
html, body {
    height: 100%;
}
.wrapper {
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -142px; /* the bottom margin is the negative value of the footer's height */
}
.footer, .push {
    height: 142px; /* .push must be the same height as .footer */
}

/*

Sticky Footer by Ryan Fait
http://ryanfait.com/

*/

---

You must set html and body to have height:100%;

then to overcome another issue with body only filling the viewport, you need to put a wrapper around all your content, set its min-height to 100% and put the background images to that.

Demo code : http://jsfiddle.net/fNwNn/3/
Live view : http://jsfiddle.net/fNwNn/3/show

---

I think what you want is position: fixed

Try this:

#footer
{
    position: fixed;
    bottom: 0px;
}

This will 'stick' the footer to the bottom of the window.

James

---

See if this is what you want: http://www.designersandbox.com/code/always-bottom-footer-with-css-only-tutorials/

and a live example:

http://demo.designersandbox.com/always_bottom_footer/index.html

---

If you actually want the footer to be able to cover the page contents, then you should remove this line

#vc-body{padding-bottom:80px;} 

from the given example.