Note: This post is outdated, and I also lost the images I used in this post. (My site was deleted, and none of my backups had the images for this post. Oh well. But I’m keeping it here for archival purposes anyway.

If you happen to be one of those web designers on that elusive quest to find the perfect 3-column layout, Michael Levine’s article on A List Apart might interest you. His technique uses minimal <div>s, requires little CSS, and uses only one CSS hack for IE6. (Actually, Levine leaves out the box model hacks needed for IE5.5, but a quick Google search should help you with pleasing IE5, if you don’t already know how.)

Why should I care?

Well, it’s not every day that you come across such a simple 3-column layout design. If you peruse the net for other 3-column layouts, you’ll find some annoying drawbacks, such as messy

Is it really that perfect?

No, of course not! I hate to say it, but until Firefox, Mozilla, Internet Explorer, and Opera clean up their act, web designers will never have it easy. Of course, some browsers try harder than others, but let’s not point fingers.

Check out what Levine’s layout looks like in IE6:

If you resize the window just right, you’ll end up with a missing left column. (Not something you want happening to your layout, right?)

Well, at least it works flawlessly in Firefox, right? Nope:

Again, not perfect. If you resize the window too small in Firefox—I’m using Firefox 1.5 by the way—then the right column falls off.

Unfortunately, Michael Levine’s 3-column layout isn’t as perfect as it seems, but it’s certainly a nice alternative to some of the other 3-column attempts out there. And with a bit of CSS tweaking, you may be able to work around the flaws I just mentioned. In any case, it’s nice to know what options you have out there.