Issue 194
Subgrids, nested grid, CSS clip-path and Shapes.
News
Issue 194
I'm in San Francisco today at Smashing Conf, teaching people CSS Layout yesterday in an all-day workshop. I'm not speaking at the conference so this is chance to hang out with the Smashing team and a bunch of other fine folk in the sunshine here in SF. If you are at the conference come and say hi!
At my workshop yesterday I was able to show attendees some of the upcoming CSS Grid subgrid functionality. I've also written that up on my blog and it is linked below, I'm so excited to see this on the way!
Rachel Andrew, CSS Layout News
I really can't wait to be able to teach subgrid in my talks and workshops. Here is an early look, folk at my Smashing workshop yesterday got to see bits of this too, which was fun.
Learn
An article about using CSS Shapes to create art directed layouts. If you have learned how to use Shapes then this is a good next step to really starting to create interesting layouts with them.
A quick tip showing how to use clip-path and box shadows together.
Relevant as we start to play with subgrid. People keep telling me nested grids are like nested tables, in this post I explain why they are not.
Creating diagonal containers in CSS by using the CSS clip-path property.
Interesting
A really lovely style guide design from Olivia Ng who has been doing some really nice things over at CodePen. I wish I had the design skills!
Our Sponsor
I've distilled my knowledge about CSS Layout into this training course. This course has something for you if you are new to CSS, have been using frameworks for a while and want to understand how they work, or have been doing this for a while but want to understand the newer layout methods. The course includes video tutorials, text explanations and all the starting points to follow along.
The full table of contents gives an overview of what you can learn - at your own pace. We also have a Slack community where you can ask questions about the course materials.