Interesting techniques with grid, subgrid, flexbox, and custom properties.
Late sending this today as I've had one of those days where nothing went to plan, and I'm writing late in the evening with one ear on SmashingConf Austin online. I'll be speaking tomorrow about new things in CSS. Some nice techniques in the articles I'm sharing today however, so I hope you find something interesting among them.
Also in the last week, Smashing pre-launched the book Typescript in 50 Lessons. I edited the book, and while it's not CSS I imagine there is some crossover of readers here and folk who want to learn Typescript. It's a friendly introduction to the subject, if it is something you would like to learn.
Rachel Andrew, CSS Layout News
Release Notes for Safari Technology Preview 114 | WebKit
Includes the flow-relative shorthand properties, among other layout updates.
AddyOsmani.com - Preload late-discovered Hero images faster
link rel="preload" to load primary images more quickly.
The --var: ; hack to toggle multiple values with one custom property – Lea Verou
A neat idea from Lea Verou, to change multiple values across multiple properties.
Balancing on a Pivot with Flexbox | CSS-Tricks
This is a clever technique, using flexbox to centre a bunch of things around a pivot.
Achieving Vertical Alignment (Thanks, Subgrid!) | CSS-Tricks
An article about vertical alignment which finds the solution in
subgrid. Great to see more people starting to think about how the feature can help their layout challenges.
CSS Layout News Newsletter
Join the newsletter to receive the latest updates in your inbox.