Tomorrow I head to Athens, Greece for Frontend United. I am speaking and also running a CSS layout workshop.
Rachel Andrew, CSS Layout News
I love the Firefox Grid Inspector, but I'd love to see Grid support in Chrome DevTools. There is an issue raised to add it. If you would like to see it happen, then starring the issue shows that there is interest in this as a feature.
A fairly major update to Grid by Example. I've created a Getting Started guide with links to various things I have written and recorded, on and off the site.
Also the beginnings of a whole new section of patterns which include fallbacks for older browsers.
People keep asking me about animating the grid. Happy to see a post explaining what is animatable and demonstrating the fact that there is poor browser support currently.
In this video from CSSconf EU 2017 Patrick Hamann explains how browsers render a webpage, and how you can optimise in order to get a faster loading experience.
SmashingConf San Francisco 2017 - Rachel Andrew on Laying Out The Future With Grid And Flexbox on Vimeo
A video of my talk from Smashing Conference in San Francisco a few weeks ago.
An interesting article about form design and the "one thing per page" pattern.
"This pattern is about splitting up a complex process into multiple smaller pieces, and placing those smaller pieces on screens of their own."
Some techniques for creating headings using CSS Grid. There are a lot of handy small places like this where grid can help finesse layout. It's often in these places you can start to use it - even if you need to do your major layout components using older methods.
Even if you are not using Material, this Color Tool is useful. Try out colour combinations and then text the accessibility of text, making sure your choices don't result in unreadable combinations. I like the ability to then open the result in CodePen.
A cute little set of Flexbox buttons. Although why people persist in creating small demos with languages not HTML is beyond me. Make it easy for people to fork and play with stuff!
Your online content strategy should no longer be restricted to your primary website. When it comes to publishing – and reusing – your content in marketing sub-sites, mobile apps, third-party systems and such you don’t need to choose between a traditional web CMS and a headless alternative.
Download and try it today!
CSS Layout News Newsletter
Join the newsletter to receive the latest updates in your inbox.