Making a footer not rise above the bottom of the screen without extraneous markup

Question

If you only had to worry about Firefox and Webkit browsers, what CSS would you use to make the footer in the following HTML not rise above the bottom or the screen (and go lower

Answer 1

Okay, here is the alternative css that I was talking about. It works in Firefox, Safari, and Chrome. IE7/IE6 don't work, you'd probably have to a little tweaking to get that working. Opera has a small bug with the body margins. Other than that, it uses just basic CSS (unlike the display:table that isn't very compatible).

    
    


    

        
Title of your page
        

            Foo bar baz

            Foo bar baz

            Foo bar baz

            Foo bar baz

            Foo bar baz

            Foo bar baz

        
        
This is a footer
    

Wow, if you just tweaked it a little and made it IE6-7 compatible, you'd be famous. I think this is the first solution I've seen.