Are you backing feature queries yet?

Oh boy you should get onboard! Now supported by all major browsers the revolutionary CSS Grid technique is taking off in the web community. Using Grid, ultra-creative layouts are possible with items elegantly placed anywhere on your canvas. And the great news is we've tons of materials to help you learn it.

Our very own Bob (the CSS) Builder has written up a great guide detailing the fundamentals of working with CSS Grid along with two helpful tutorials.

CSS Grid Baby!
" CSS Grid providing more control and being less complex allows for more creativity. The web will be a more interesting place because of it. "
— Bob Visser at WordCamp US
 

Tutorials, videos, and apps – oh my!

If you're like us, it is easier to learn new tricks when you have a playground to practice on. So we whipped up a cool (and free) app, The CSS Grid Builder, so you can do just that.

In Bob's first demonstration, he explains how Grid is implemented when building the hero section of the new CoffeeCup homepage. He breaks down the markup for you hand coding fans, as well as shows in a video how it can be done visually with our free app.

The second educational article discusses Feature Queries. These allow you to create production-ready designs with CSS Grid as the layout framework — today! By applying fallbacks, your design will look good everywhere, even on unsupported browsers.

As explained in the article, this control would be an awesome addition to Grid Builder app. And you can help make it happen by becoming a backer of the project. You'll get the full Grid Builder app for just $29 (will be $129 later) along with upgrades.

 
Start with the Guide
 
Back Feature Queries
 
 

Happy Gridding!