Sticky footer doesn't stick

HTML & CSS
1

I’m trying to design the footer on this page to stick to the bottom of the browser window, without covering up any content when the window gets smaller. I can’t seem to get it to work.

Any suggestions?

Here’s a link to my webpage and css.

http://equinox-landscape.com/beta/sticky.html

http://equinox-landscape.com/beta/sticky.css

I used this technique - New CSS Sticky Footer - 2010 - HTML for Bottom of Page Footer

I’m willing to abandon this code and try something else if necessary.

Any help would be much appreciated.

2

Hello, I know this works. http://www.visibilityinherit.com/code/sticky-footer-demo.php

3

I had one little detail wrong. The footer was inside the wrap.

Thanks for your help.

4

After viewing your source code from my iPhone (yes!) it looks like you have the footer insid the wrapper. It is supposed to be outside your wrapper. Also, probably better to pu any padding on the inner elements rather than the footer.

5

You don’t seem to be using the up to date current code for the sticky footer anyway and that means you will have problems in IE and opera. See the css faq (link in my sig) as it contains all the code you need for modern browsers.