Scarcely a week goes by without a post in a web design forum somewhere on the lines of .."how do I do this in css" or "..how do I replace this table with css". CSS purists all over the web have been promoting the idea that tables are bad for so long now that some people think they're breaking the law or worse if they use a <table> tag in their website.
Well, I've got news for them - you are still allowed to use tables!
Tables vs CSS
This is not a css vs tables rant, and I am certainly not advocating a return to the nested table and spacer gif nightmare of years gone by, just a plea for common sense. A lot of people seem to think you have to use one or the other, but in fact CSS and tables can be used together.
Much of the effort put into designing css only layouts involves using the "float" property to produce columns. While that is simple enough to achieve on a basic level, coming up with a method that produces equal height columns no matter which has the most content, where the footer stays below the columns, and which works correctly across all browsers has taxed experts for years.
People are still coming up with new variations using all sorts of esoteric methods and hacks, such as negative margins, to do what a simple table has always been able to do.
Tabular Data
It is often said that tables were designed for presenting tabular data only and shouldn't be used for anything else. Well, its been said before - the world is full of things which were originally designed for one purpose, but which people found could be used for an entirely different purpose. The internet was designed for sharing scientific data - does that mean we shouldn't use it for anything else?
In any case - what is data? If you ask me, data might be something like a product picture, description, price, "buy now" button, or menu, article, advertisement. Tabular data is surely data in which there is a unique relationship between one set of data and another e.g. all the data on one row refers to a particular product. Again, that surely could include price, description, picture, etc.
