Same technique, tested in IE6 to IE8, FF, Chrome, Safari and Opera; no conditionals:

    html, body, #canvas { height: 100%; }

    body > #canvas {
        height: auto; 
        min-height: 100%;
    }

    #canvas {
        width: 100%;
        position: absolute;
    }

    #footer {
        position: absolute;
        bottom: 0;
    }

HTML:

    <body>
        <div id="canvas">
            <!-- all of your other code -->
            <div id="footer"></div>
        </div>
    </body>