Hi friends! Way back in June (which already feels like such a long time ago in CSS land!) I had the pleasure of speaking about CSS layout at CSS Day conference. I’m pleased to say the video has now been published! Take a look to learn about a whole bunch of modern CSS layout techniques, with a few little tricks thrown in.
I attempted to pack a lot into this talk, but what I tried to emphasise is that many of the new CSS features we have at our disposal help (and even encourage) us to embrace the flexible web of the present day. One where we can’t possibly predict what kind of devices our user is browsing our website on, but where we can ensure our layouts are robust across all devices, by eschewing pixel-perfection in favour of something more intrinsic to the web. Material honesty, as Jeremy talked about. Diversity is the web’s strength, not its limitation.
Container queries are here!
Speaking of CSS layout, Container Queries have finally landed in the latest (stable) version of Chrome! Miriam Suzanne has a great write-up covering the syntax.
There’s also a polyfill by the Chrome team, so you can use it now!
:has() too!
As if that wasn’t enough exciting CSS layout news, both Chrome and Safari have shipped support for :has(), AKA “the parent selector”! Jen Simmons has the lowdown here, and Una Kravets covers both features for the Chrome Developer Blog.
On flexibility
Somewhat related to the flexibility of the web, I enjoyed reading a recent blog post exchange between Dave Rupert and Matthias Ott. Dave laments the increasingly wild range of jobs thrust onto the shoulders of front end developers. They both talk about “bridge” roles, and Matthias points out that an evolution in design thinking is needed now more than ever, when we take into account all the flexibility that CSS now provides us with (see above!).
I love to see these conversations play out, even if it may be some time before we agree on the solutions.
- The Web is a Harsh Manager by Dave
- Better Bridges by Matthias
Smashing Conference Freiburg 2022
Want to learn all about the latest and greatest CSS layout features? Come along to Smashing Conference in Freiburg, 5–7 September! We’ll explore container queries and much more, live on stage!