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

ISSUE 272 13th October 2020

News

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.

webkit.org

Learn

AddyOsmani.com - Preload late-discovered Hero images faster

Using link rel="preload" to load primary images more quickly.

addyosmani.com

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.

verou.me

Balancing on a Pivot with Flexbox | CSS-Tricks

This is a clever technique, using flexbox to centre a bunch of things around a pivot.

css-tricks.com

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-tricks.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 271

Tuesday, October 6, 2020

Flexbox gaps, DevTools, accessibility resources, and media queries View on the web Archives ISSUE 271 6th October 2020 News Issue 271 Lots of interesting things today, perhaps everyone is back from

CSS Layout News - Issue 270

Tuesday, September 29, 2020

MDN Browser Compat Report, accessibility, animation, font-size with clamp() View on the web Archives ISSUE 270 29th September 2020 News Issue 270 Animation and accessibility feature heavily this week,

CSS Layout News - Issue 269

Tuesday, September 22, 2020

In-depth with the display specification, sortable tables, and accessible navigation View on the web Archives ISSUE 269 22nd September 2020 News Issue 269 Being a bit light on content this week, mostly

CSS Layout News - Issue 268

Tuesday, September 15, 2020

CSS Clipping and Masking, a free 24 hour Inclusive Design event, Interaction Media Features View on the web Archives ISSUE 268 15th September 2020 News Issue 268 It's a little strange as we head

CSS Layout News - Issue 267

Tuesday, September 8, 2020

Custom list bullets, browser diversity, JavaScript Media Queries. View on the web Archives ISSUE 267 8th September 2020 News Issue 267 I am writing this while waiting to present at the online

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 272