CSS Layout News - Issue 313

I'm enjoying watching the Olympics coverage early in the morning here in the UK, for once my getting up before dawn is working out for me. To poorly link this intro to CSS, here are some CSS-only Olympic rings created by Matt Smith on CodePen.

The CSS Working Group has been meeting this week, with some longer meetings to partially replace our very much missed face-to-face meetings. An interesting resolution is to publish the CSS Nesting specification as a First Public Working Draft (FPWD). The move makes it an official specification, rather than an idea. Find the browser implementation bugs below:

• Chrome
• Firefox
• Safari

On that note, there is a fair amount of browser-related information this week, with the Compat 2021 update, and a lengthy piece about the work on RenderingNG. I hope you find it interesting.

Rachel Andrew

News

Compat 2021 mid-year update: Flex gap everywhere

An update of the progress of Compat 2021, the effort to improve web compatibility in five key focus areas—CSS flexbox, CSS Grid, position: sticky, aspect-ratio, and CSS transforms.

Safari Technology Preview 128

Includes some scroll snap and flex bugfixes.

Learn

Overview of the RenderingNG architecture

The second post in a series about RenderingNG, the updated Chromium rendering engine that is already fixing many longstanding CSS issues, with more to come. This post is a detailed look at the architecture and how the rendering pipeline flows.

Designing for the Unexpected

"By putting content first and allowing that content to adapt to whatever space surrounds it, we can create more robust, flexible designs that increase the longevity of our products."

This is a lovely article covering the way our new layout methods can be used to create designs that cope with whatever is thrown at them.