Issue 60
A revised Regions proposal, grid demos, layout inspiration, and media queries come to Gmail
News
Issue 60
Today I'm at SmartWeb in Bucharest and we have already had some real world CSS Tricks from Vitaly Friedman of Smashing Magazine and some interesting but practical things that can be done using CSS for decoration from Razvan Caliman.
I'm up after lunch with a talk about layout, one of my new demos for this talk is linked up in the email this week, with a post to explain some of the details.
Rachel Andrew, CSS Layout News
Last week I spoke at View Source and you can find my slides, all the CodePen examples and some useful resources here.
For the longest time Gmail has not supported media queries, making responsive emails very difficult to do. Later this month however that will change making it possible to use CSS Media Queries in email. Given the number of people using Gmail, this is excellent news.
I've hoped to see a return of activity around the CSS Regions specification. Jen Simmons agrees and has come up with a suggestion for a somewhat simplified version that relies on Grid Layout. It also includes a way of enabling styling of grid tracks, cells and areas.
If you aren't familiar with what Regions can do I have a video here.
There has been an issue raised against Level 2 of Grid for the potential of pseudo-elements for grid styling.
Learn
An excellent article from Jen Simmons on the possibilities for creativity offered by our new layout methods.
I had a couple of emails from people asking me whether the CSS Grid Layout I've been talking about was the same as "CSS4 Grid". Perhaps because we were referring for a very long time to the collection of modules that were Level 3 as CSS3, this idea that CSS4 is coming seems to have taken hold. In this post I explain why there is no CSS4, and how CSS is now versioned.
From the SitePoint A-Z of CSS series. A quick tip on using float and clear.
I'm working on various examples using Grid Layout for smaller interface elements as it is often easier to start using new CSS as an enhancement initially. Here is a blog post explaining key features from a login form example.
Interesting
I wish I could see the code behind this as I'm always interested in how people are describing layout on the web.
Our Sponsor
In this workshop I pass on everything I know about CSS Layout. My aim is to explain how the existing methods we have been using work, why they are limited and what they really are useful for. Then give you all of my knowledge about new layout methods - Shapes, Flexbox, Grid and more. You'll know when and how to use these methods now and in the future.