Skip to content

Issue 272

Interesting techniques with grid, subgrid, flexbox, and custom properties.

Rachel Andrew
1 min read


Issue 272

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.

Learn - Preload late-discovered Hero images faster

Using 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.