For quite a few years now, people have been trying to remove tables from the structure of their sites. They cause numerous accessibility problems, they make it next to impossible to change brand styling, and they produce horribly bloated pages.
But people still want muti-column layouts. They want them to be flexible. 2, 3, 4 columns. They want them to be consistent, so that all columns are the same length. This is where CSS falls over. Or so we were led to believe. Several people came up with their own ways to do this. Some using images, some using floats and clears. Things like this should not have to rely on images to simulate columns. But floats rely on one column being longer than the others. But what if you don't know which should be the longest?
Well, this is what tables do. And they do it very well. But how do we use tables, and break free from their restrictions at the same time? Simple. Use CSS table display styles to convert existing structures into a pseudo table. Sounds good. And it would be, if only IE bothered to support them. But hey, if they haven't implemented styles from CSS 1, what are the chances of them implementing something as clever yet simple as this from CSS 2? Even if it does date back to before IE 5.
Demo: The main contents of this page should be held in a three column layout.
Workaround: Stick with minimalist tables (where you use them to define the columns and nothing else). For now..
Move on to the next page in this article > >