CSS to make HTML page footer stay at bottom of the page with a minimum height, but not overlap the page

Question

I have the following page (deadlink: http://www.workingstorage.com/Sample.htm ) that has a footer which I can\'t make sit at the bottom of the page.

I wa

Answer 1

My jquery method, this one puts the footer at the bottom of the page if the page content is less than the window height, or just puts the footer after the content otherwise:

Also, keeping the code in it's own enclosure before other code will reduce the time it takes to reposition the footer.

(function() {
    $('.footer').css('position', $(document).height() > $(window).height() ? "inherit" : "fixed");
})();