Wow. I’m blown away by Rachel’s matter-of-fact handling of what is a pretty complex spec (well, it is to me, at least).

If this is the future, I’m slightly intimidated! There are many, many shortcomings to the current widely-supported set of CSS functionality, particularly in the layout department, but it never had this kind of learning curve.

Of course, the beauty of the additive CSS spec is that no-one’s going to stop me making sites using the older layout properties. Not yet, anyway. :)

Actually CSS grids can be used already. Admittedly not for the web but Windows 8 Style apps in HTML, CSS and Javascript. Actually it seems grids are even the default and preferred way of doing the layout of such an app. I did one app using this layout and it is much nicer than the usual floats, positioning, display: table and stuff.

Would be nice if more browsers would support this. To really use it on the web it will take years though but at least there is an applicability option now.

Great article Rachel.

Not directly related to Grid layout, but may be useful for your demos: In IE10 using the Metro UI (or whatever it is now called), you can not resize the browser window, but you can put it in a split view, where the smaller docked window is always 360px wide. This view ignores meta viewport, so all of the adaptive demos will render as If they used the widest query. It does support CSS viewport however, so if you use @-ms-viewport, the grids would adapt to show your skinny mobile optimised grids. See http://dev.w3.org/csswg/css-device-adapt/ for details.

For the longest time we stayed away from frameworks and grid layouts (remember the original Yahoo framework?) as we thought they were too confining. Well here we are years later and we couldn’t live without them. Especially with the importance of mobile content.

Great break down and great read. Thank you.