If anyone can solve this, I would honestly think you're a genius. I've been using html/css 10+ years and this has bugged me for days!

You can see the problem if you view http://www.dripsplat.com/dev/ttass/courses.php and click the "course outline" link to expand content. Content expands but footer stays where it was originally.

I've tried all sorts of footer positioning techniques, but IE6 has troubled me far too much. It works fine in all other browsers!

Any help would be hugely appreciated!

Basic layout is done by


I understand the current method is using padding-bottom on the #content div which is the value of the footer height and that IE6 doesn't play well with padding.


I had a similar problem with a Jquery toggle container which I fixed by placing overflow: auto; inside the container and for good measure I created a class to clear the container:

.clear { clear: both; }

and placed it under the container in my html

<div id="slickbox">...</div>
<div class="clear"></div>

I don't know if you have the same problem but it worked for me.

The Internet was not really meant for you to place a footer at the bottom of the screen.