CSS vs. Tables

Yes, the old battle, CSS vs. the traditional positioning tool: Tables.

As much as I hated to do it, I’ve ripped out the DIVs that defined the left-hand column (blogroll etc) and the main content area and made that into a table.

I didn’t want to do this, but I was having too much trouble across browsers getting things stable. This does it, and it does it in a very good way, the way we expect tables to behave.

I’m not giving up on CSS for positioning, but I just spent about five hours trying to get what I want (not much, really, two columns, full length color in each, fluid).

I know it can be done; I’ve done it a few different ways, but I’m looking for behavior that is, well, table-like. Specifically, I want the following (and remember this is just for the left-hand and main content column):

  • Two column layout, that maintains color/border for full-length of longest of the two columns (challenge in CSS; need to have a parent wrapper that holds the two child columns)
  • Layout must be fluid. One column can be a fixed width if necessary, but it must be fluid in the manner expected by table-based layouts.
  • Work in common browsers (IE 5-6; Netscape/Mozilla at minimum)
  • No absolute positioning (I plan to offer themes for the blog at some point; absolute positioning would complicate this).

That’s really not a lot to ask, but … it’s a challenge.

But that’s fun, too.

And – thank ROOT for the Web – there are a lot of resources out there. I just have to find the help I need somewhere and make it work. I’ve done this before on other projects; just having issues here and I’m not sure why, which is the wild card.

Onward.