Issue 129
News
Issue 129
At the end of 2017, I told myself I wouldn't travel so much in 2018. Yesterday I started to wonder whether a good plan for the year would be to stay in an airplane circling the globe, being dropped off every day or so to do a talk! I'm really looking forward to all the talks and workshops I've got lined up this year though. Keep an eye on my speaking page if you want to know where I'll be popping up next. I've also started writing weeknotes, mostly to remember what I've been up to, but you might find something useful there.
I'm not the only person who is already full steam ahead into 2018, so I have a nice bunch of links to share this week.
Rachel Andrew, CSS Layout News
Review of Igalia's Web Platform activities (H2 2017) - Frédéric Wang
Igalia implemented CSS Grid into Blink (for Chrome) and WebKit (for Safari), and they do a huge amount of work on the Web Platform that we all benefit from. This post explains what they have been working on in the past few months.
Help Test New Firefox DevTools for CSS Shapes, Clip Path, Flexbox and Grid on Vimeo
A video from Jen Simmons asking for feedback on some of the new Firefox DevTools for CSS Shapes, Clip Path, Flexbox and Grid.
"display: contents" is coming - Rego's Everyday Life
"Yes, display: contents is enabled by default in Blink and WebKit and it will be probably shipped in Chrome 65 and Safari 11.1. These browsers will join Firefox that is shipping it since version 37, which makes Edge the only one missing the feature "
Intent to Implement: CSS Layout API - Google Groups
The Intent to Implement post for the CSS Layout API, part of Houdini.
Learn
How Big Is That Box? Understanding Sizing In CSS Layout — Smashing Magazine
Something that quickly became obvious in a workshop setting was how confused people were about the size of things in flexbox and grid. It turns out that percentages, while they look ugly, are pretty easy to understand - flex-grow factors and fr units less so. In this article I break down the different ways we can size tracks in grid layout.
CSS Grid + CSS Multi-Columns = ♥ – Patrick Brosset – Medium
An article exploring the relationship between two CSS layout features: CSS Grid and CSS Multi-Columns.
Video - Content sizing keywords
I recorded a new video for my series over at Grid by Example, showing how to use the content sizing keywords to size grid tracks.
Meet the New Dialog Element
The new dialog HTML element, including details of how to style it.
Our Sponsor
Coming to Smashing Conferences fundamentally changed how I develop websites."— Ryan Chittenden, Director of Web Development, Fuego Digital Media
With our third SmashingConf San Francisco taking place on April 17 & 18, we want to explore strategies for making outstanding, fast experiences, and what we all need to know today, to be more productive and make smarter decisions tomorrow.
One track, two conference days, 14 brilliant speakers, and just 500 available seats. Make your experience even more memorable by attending one of our workshops. Get an early-bird ticket → before Jan 31st and save $100.