Someday You Will Not Hate the CSS3 Advanced Layout
At first glance you’re going to hate the “advanced layout” that is currently a W3C working draft. Maybe it’s the similarity to table-based layouts, of which we all still have nightmares. Mainly, you’ll likely cringe just because it’s such a foreign way to write CSS. I think you’ll eventually come around.
Consider this common layout: a header covers the top of the page, followed by a left sidebar, content area, and a right sidebar. The proposed CSS declaration for this example is display: “aaaaaa” “bccccdd”. Note that this has not been declared a standard, nor is it supported by any browser yet. It’s just a proposal.
Creator of jQuery John Resig likes it, and he’s always one to jump at simplified syntax. The funny thing about this advanced layout, which you probably still hate, is that it’s actually simpler than the floats and clears that have to happen to create similar layouts with CSS today.
As much help as CSS frameworks have become, they can add extra weight, with markup that provides CSS hooks, but does not make sense semantically. In the case of the so-called advanced layout, once you have described the grid with the sequence of letters, you can simply refer to the positions in CSS:
#header {
position: a;
}
#sidebar {
position: b;
}
...
The outcome is HTML that doesn’t need to be unneccessarily nested. CSS without confusing calls to grid-based rules.
What do you say? Do you like it yet?
See also:
