We made it to issue 300. This week: custom properties, CLS, breakpoints.

ISSUE 300 27th April 2021

News

Issue 300

It's issue 300! I've been sending a weekly CSS Layout News since the 4th August, 2015. If you need a reminder about how very long ago that was, the issue led with the release notes for Chrome 44! I announced Grid Layout shipping in Firefox in issue 84 and Chrome in issue 85, over 4 years ago.

I noted last week, as I was preparing an update to my talk on new things in CSS, how quickly things are shipping into browsers now. Things that I included as coming soon features, have landed in browsers by the time I give the talk again, and new things have started to show up. I started this newsletter to help promote the upcoming grid spec, and it's very cool that there are still plenty of new layout and layout-adjacent things happening to let me make it to issue 300—and beyond!

Rachel Andrew, CSS Layout News

Learn

Understanding Display

Slides and resources for my talk at Web Directions hover, a conference just about CSS.

noti.st

Don't you forget about me: overlooked breakpoints in responsive design.

An article about some breakpoints that you might want to pay a little more attention to.

polypane.app

Sortable Table Columns | Adrian Roselli

Another excellent article from Adrian, covering a design pattern that many of us will have had to deal with at one time or another.

adrianroselli.com

Getting started with CSS Custom Properties - Tutorial - Piccalilli

Custom properties in CSS are exceptionally useful, not just for tokenising your CSS, but also for abstracting complexity and interactivity into smaller, easier to manage pieces. This short guide will get you up to speed with how they work and how to use them.

piccalil.li

A Complete Guide to Custom Properties | CSS-Tricks

After reading the earlier short primer, here's a complete guide to custom properties to help you take the next step!

css-tricks.com

Exploring color-contrast() for the First Time | CSS-Tricks

Chris takes a good look at the upcoming color-contrast() function.

css-tricks.com

The Almost-Complete Guide to Cumulative Layout Shift

A solid guide to Cumulative Layout Shift (CLS). This is a measurement of the annoying experience of a layout shifting around as you try to use it, leading you to click on the wrong things or lose your place.

jessbpeck.com

You received this email because you subscribed via the CSS Layout News site.
We'll be sorry to see you go but you can unsubscribe instantly.

Spike Island 133 Cumberland Rd Bristol BS1 6UX

CSS Layout News - Issue 299

Tuesday, April 20, 2021

Safari Grid Inspector, Firefox 88, understanding CSS. View on the Web Archives ISSUE 299 20th April 2021 News Issue 299 A slightly shorter email this week as I was out this morning driving to another

CSS Layout News - Issue 298

Wednesday, April 14, 2021

More on Container Queries, clipping and masking, accessible components View on the Web Archives ISSUE 298 14th April 2021 News Issue 298 Last week I spent a bit of time digging into container queries

CSS Layout News - Issue 297

Tuesday, April 6, 2021

Horizontal rules, SVG grids, or build your own web browser View on the Web Archives ISSUE 297 6th April 2021 News Issue 297 I hope those of you who celebrate (the Western church) Easter, had a good

CSS Layout News - Issue 296

Wednesday, March 31, 2021

Container Queries, CSS Performance, and more interesting things about color. View on the Web Archives ISSUE 296 30th March 2021 News Issue 296 I've still not moved platform for this newsletter yet,

CSS Layout News - Issue 295

Tuesday, March 23, 2021

Fixing compat pain points, color-mix(), blend modes and masking. View on the Web Archives ISSUE 295 23rd March 2021 News Issue 295 Today marks a year since the first lockdown here in the UK, I just had

Behind the Design of Lauren Santo Domingo’s Ski House

Thursday, November 21, 2024

View in your browser | Update your preferences ADPro Peak Style When it comes to clients, says AD100 designer Andre Mellone, “my biggest nightmare is a person who says, 'Carte blanche, do whatever

2025 Interior Design Trends, Revealed

Wednesday, November 20, 2024

View in your browser | Update your preferences ADPro Image may contain: Furniture, Chair, Interior Design, Indoors, Home Decor, and Rug Inside Our Newest Trend Report “Design, like fashion, tries to

Want a free strategy session with us?

Wednesday, November 20, 2024

Plus, the emails editors open most often. ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏

One Simple Thing You Can Do to Retain Your Staff

Tuesday, November 19, 2024

View in your browser | Update your preferences ADPro By my account, it's not fall until I've watched You've Got Mail, Nora Ephron's '90s film adaptation of the 1930s Hungarian play

#483: UX Writing

Tuesday, November 19, 2024

With writing guides, content testing and practical guides for better content design. Issue #483 • Nov 19, 2024 • View in the browser Smashing Newsletter Hej Smashing Friends, Every digital product

Accessibility Weekly #423: Beautiful Focus Outlines

Monday, November 18, 2024

November 18, 2024 • Issue #423 View this issue online or browse the full issue archive. Featured: Beautiful focus outlines "Unfortunately, focus outlines are often overlooked in web design.

175 / Build your ideas without writing any code

Monday, November 18, 2024

Product Disrupt Logo Product Disrupt Half-Monthly Nov 2024 • Part 1 View in browser Welcome to Issue 175 One month ago, I quit my longest-standing job and embarked on a pathless path to let my

Into the Fediverse

Sunday, November 17, 2024

Issue 221: We need decentralized social networks ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏

The Books AD Editors Can’t Put Down Right Now

Friday, November 15, 2024

View in your browser | Update your preferences ADPro Good Reads Here at AD PRO, we're all about celebrating a good coffee table book. With crisp project imagery and behind-the-scenes stories tucked

What astrology has to do with PR?

Wednesday, November 13, 2024

and, no we won't tell you to read your chart! ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏

CSS Layout News - CSS Layout News - Issue 300