| We're thankful for CSS Grid... |
Clearly, there are more important things in life, but the endless layout possibilities using this new technique has got us excited. We love it so much that we created a free app, CSS Grid Builder, and put out a guide to help you get excited about it too. |
We're also thankful for 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. |
But beware...they have to be done right to get the job done. There are many examples and explanations out there that do not work such as: |
|
|
|
Can you spot the glitch? Bob explains why this does not work in his new article Feature Queries for CSS Grid. The fallback-first approach, however, is bulletproof and can be used to build production-ready layouts right now. |
In short, this approach means first defining the fallback layout with code ALL browsers understand. Then, after that experience is 'good enough' a better layout experience can be created with CSS Grid code inside of a feature query. |
You can still prototype your grid layout with CSS Grid Builder. Then grab the code and wrap the feature query around it. This is how Bob did it, but it's a bit tedious — we can do better here! But your help is needed for that to happen... How exactly you can help is explained towards the end of the write-up. Give it a read and try it out over the holiday weekend. |
If you missed the first tutorial in the educational series, we certainly recommend it. You can watch how Grid is being used to rebuild the CoffeeCup homepage. This documentation is super helpful when learning the principals of CSS Grid. |
From all of us at CoffeeCup Software, we wish you a Happy Thanksgiving. |
|
|
| |