CSS Grid safe to use?

Back Story:
Hi. I am in the design process of my upcoming personal website. I want to use a lot of modern CSS techniques to add polish, but at the same time I require it to be accessible.
Now, I know how Transitions gracefully degrade, but Just yesterday I stumbled across the CSS Layout Grid (slated for full support w/ modern browsers once IE10 comes out).
The problem is, the w3c draft doesn’t clarify anything about how it degrades: http://dev.w3.org/csswg/css3-grid-align/

The Actual Question:

Does anyone have any working experience with the CSS grid?
How exactly does this degrade?
Is it backwards compatible?


There little to no-support for grids. I believe IE10 is planned to support it but that is about it from what I recall. That is something I recommend staying away from in the CSS3 specification. Where did you read that most other browsers support it – link?

I guess that was just a flawed presumption, being that the other browsers are usually quick to adopt the latest standards.

It’ a shame really, because I would really like to use some sort of Grid based layout. Having just recently learnt about some key design principles (including the grid).
Given poor browser support for CSS3 grid, what is the current method that designers are employing to achieve this?

There are a few CSS Grid frameworks out there which seem to provide good enough alternatives. The idea is to use CSS classes for rows, columns and sizes. Some of those CSS Grids put restrictions and provide you with predefined widths/number of columns only. Others give you more room for creativity and offer tools to create your own grid. Good example of the latter would be my UGrid - http://webnicer.com/ugrid/creator.html In the download bundle you get a handful of HTML templates with FAQ plus a Photoshop script which generates new document with guidelines and overlays for different column combinations.

I hope it makes sense.


Oh wow! That UGrid looks really nice. Thanks for sharing

I’m glad you like it. Happy to help if you have any questions.