Main
Intro

This article on A List Apart has been a great source of inspiration for me. After taking this solution for a "test drive", I decided to implement negative margins the "other way around".

I think the major advantage of my technique is that it uses fewer non-semantic elements and one less "float". It also seems to cure small issues* not listed in the original article.

This new - I hope - solution to create a table-less fluid three-column layout appears to be free of:

  • CSS hacks
  • Structural hacks (for clearing, see #5)
  • IE/Win Conditional Comments
  • Cryptic CSS rules
  • Lengthy Styles Sheets
  • "Best viewed in..." statements (see Browser Support)

I have created a more "sophisticated" design based on this technique; this is the CSS challenge that "got me started".

* In the ALA demo, links inside the right column appear not to be clickable in Opera 6. There are background painting problems in IE as well. Also, there is one structural hack missing from the markup that makes NN6 unable to clear the left column.

Please use this contact form to send feedback and report errors.