Has anybody ever used tables for a liquid layout?

Question

Creating liquid layouts is an immense pain. Now, I totally understand that tables should be avoided for layouts like the devil but... it appears to me that table cells are uniquely suited to fit the entire space available.

Has anybody used tables for a perfect liquid layout? Please enlighten me on the perils and pitfalls.

Answer 1

The main drawback to using tables for layouts is getting mocked and downvoted by anti-table fanatics :)

Ok, seriously, the 'fanatics' have a point. Tables are best used to present tabular data. The leads to a more 'semantic' web. And, as a very practical point, using them for layout may confuse screen readers into thinking there is some useful data contained in the table's cells. (Which there is, but nested farther down - not directly in the layout cell.)

However, it seems there are some layouts that cannot be done without tables. The site I work on must be almost completely 'liquid' - I have many customers sharing the same site templates, and I really have no idea what size (width, height) they will want their headers, menus, or content to be. Since I can't set specific sizes, or even percentages, I need to use tables. With a table-based layout, everything gets distributed nicely without any fuss. Items that are supposed to stay on the same row always do. And colspans and rowpsans are pretty handy too.

Edit: I should add that there are some values for the css display that help divs behave like table cells. I haven't really used these much, so I don't know if they would allow me to replace my table-based layouts.

And also - deeply nested table layouts are a disaster and should be avoided. I am talking about a single top-level table to contain and position the main site elements.