Hello folks,

I'm sure this has been discussed in great detail, but I have yet to find anything that really teaches me how to do it properly.

What I've got is a three column design, with the center column being the longers, and fluid. And then I've got a footer at the bottom. But my problem is that the container that surrounds the three columns, doesn't fit around the footer as well.

And example of this can be seen at: www.jmarus.com/appleloops/ (http://www.jmarus.com/appleloops/)

Can someone take a look at my CSS and see what I'm doing wrong? I would really appreciate it. I've written the code somewhat cleanly so that it should be easy to read.

Any help, suggestions, or pointers in the right direction, would be absolutely greatly appreciate.

Thanks, and take care,

Jon Marus

Here is your holy grail: http://www.positioniseverything.net/easyclearing.html

If you don't feel like reading up on the problem, scroll down to the bottom and nab the last iteration of the clearfix styles and apply this class to your container(s).

Presto chango, the problem disappears :)

Well, I've been able to fix it now, without using that method. But I'm not sure how browser compatible it is now.

Let me guess, you added clear:both to your #ftr ID, right? This would have the same effect as the clearfix idea in the link I gave you. The clearfix version is more versatile for regular use, but in your given case, applying the clear style to the footer is equally effective and cross-browser friendly.

Actually, I've known about that little gem and I'm using it above, but I didn't actually have to use it below. Very weird, I know. That's why I'm worried about trying it in IE :)