Yahoo CSS Grids

Two days ago Yahoo released an update to their design patterns that features a cool way to build a buttload of layouts using what they call Grids.

What's great is that you can easily convert your HTML into one-column, two-column, four-column by just changing the classes of some of the divs. What's more, the grids and all resultant layouts are supported in all the major browsers--they're A grade supported.

I just ran the CSS validator on one of the layouts and had a few errors, so I'll be looking into this a bit more, but it looks promising. Actually, it looks like an IE hack.

From Yahoo (I especially like the 100 layouts with one 1.82KB CSS file part):

• Full A-grade browser support
• More than 100 page layouts with a single CSS file at just 1.82KB
• Flexible scaling with user font-size adjustments
• Min-width enforcement, regardless of font or viewport size (except IE; helper JS under consideration)
• Abundant DOM hooks for CSS and scripting flexibility
• Source-order independence, allowing you to place your most important body content first in your HTML document
• Self-clearing footer (no matter which column is longer, the footer stays at the bottom)
• Centering within the viewport by default
• Forward-compatibility as standard page structure evolves to claim more screen real estate
• Accommodation for IAB Advertising Units