CSS Layout News - Issue 341

This week we have my monthly roundup of what's new on the web platform—and there is a lot that has landed or is in beta browsers right now. One of those things is style queries, available in Chrome 111 which is starting to roll out to stable. I've included a couple of posts to help you learn how they work and consider use cases.

Rachel Andrew (@rachelandrew)

News

New to the web platform in February

My monthly roundup of interesting things that have landed in stable and beta browser versions in the past month.

Getting started with style queries

Container queries to test for available size was the use case most people were hoping for, and as mentioned last week, size queries are now available in all three engines. The next version of Chrome (111) lands style queries for custom properties. This post explains how they work, and suggests some use cases.

Learn

Simplified Dark Mode with Style Queries

I think we'll be seeing a lot more articles about style queries as people think up interesting ways to use this feature. Here's a way to use them to define dark mode styles.

Resizing with CSS

A post about the CSS resize property, which creates a resizable area within a document.

Do we need CSS flex-wrap detection?

Use cases highlighting a requirement for detection of wrapped flex items.

Video: Logical Properties

CSS Weekly has a YouTube channel with some nice video tutorials, such as this one on Logical Properties.

Improved font fallbacks

This article is a deep dive into font fallbacks and the size-adjust, ascent-override, descent-override, and line-gap-override APIs.