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
View Source Conference Berlin | Rachel Andrew | Presentations
Last week I spoke at View Source and you can find my slides, all the CodePen examples and some useful resources here.
Media Queries come to Gmail
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.
Jen Simmons Proposal to CSSWG, Sept 2016 // Speaker Deck
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
6 web layout myths busted
An excellent article from Jen Simmons on the possibilities for creativity offered by our new layout methods.
Why there is no CSS4 - explaining CSS Levels
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.
AtoZ CSS Quick Tip: Float and Clear
From the SitePoint A-Z of CSS series. A quick tip on using float and clear.
CSS Grid meets the real world - a login form
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
Autolayout - Cognition: The blog of web design & development firm Happy Cog
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
Really learn the layout skills you need today and tomorrow!
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.
CSS Layout News Newsletter
Join the newsletter to receive the latest updates in your inbox.