Thanks for your quick and helpful reply!
I did try that, and it does push the footer down. However, if the browser window is resized, the footer sometimes appears below the bottom of the window, while at other times it still floats in the middle leaving an unsightly white gap at the bottom.
I have also tried various similar hacks, including these:
height:100%; to both the
body tags, and either
#main. This is much closer to the functionality I want, but I cannot seem to achieve a layout in which the bottom of the footer is flush with the bottom of the browser--there is either a scrollbar for no reason, or the unsightly white bar.
This leads me to believe that there are other elements whose height attributes are competing with that of
I am not very proficient at CSS, however, so I cannot tell which ones I should modify.
Again, all I want is for the bottom of the footer to stick to the bottom of the browser window, unless the content is longer than the height of the window.
Is there a simple way to do this?