CSS: fixed to bottom and centered

Question

I need my footer to be fixed to the bottom of the page and to center it. The contents of the footer may change at all time so I can\'t just center it via margin-left: xxpx;

Answer 1

A jQuery solution

$(function(){
    $(window).resize(function(){
        placeFooter();
    });
    placeFooter();
    // hide it before it's positioned
    $('#footer').css('display','inline');
});

function placeFooter() {    
    var windHeight = $(window).height();
    var footerHeight = $('#footer').height();
    var offset = parseInt(windHeight) - parseInt(footerHeight);
    $('#footer').css('top',offset);
}

I am a footer

Sometimes it's easier to implement JS than to hack old CSS.

http://jsfiddle.net/gLhEZ/