CSS Layout News - CSS Layout News - Issue 276

A container query-like solution with CSS math functions, detecting sticky items, :focus-within
 

CSS Layout News

 

ISSUE 276  10th November 2020

 

News

 

Issue 276

It's Tuesday again and I'm writing this before heading over to help out with the last SmashingConf of the year. I'll be speaking tomorrow on new things in CSS, after I've updated my slides as new things keep happening that I need to include or update! Not a bad problem to have.

Loads of useful ideas and tips this week, a really nice collection of layout-related stuff to look through. Thanks to sponsor An Event Apart!

Rachel Andrew, CSS Layout News

 
 

Learn

 

The Raven Technique: One Step Closer to Container Queries | CSS-Tricks

This is incredibly detailed and I will be giving it a second read. How to use math functions in CSS to create container-query like solutions.

css-tricks.com

 

How to Detect When a Sticky Element Gets Pinned

This is an answer to something I have been asked a few times. Use IntersectionObserver to know when an item has become sticky.

davidwalsh.name

 

Bidirectional scrolling: what’s not to like? by Adam Silver – Designer, London, UK.

An article about bidirectional scrolling patterns.

adamsilver.io

 

Designing User-Friendly Data Tables | UX Booth

Some tips for designing attractive and user-friendly data tables.

uxbooth.com

 

Grab your user's attention with the :focus-within CSS selector - DEV

A useful tip, demonstrating how to use :focus-within to highlight an element when any field in the form inside it is focused.

dev.to

 

Chasing the Pixel-Perfect Dream · Josh W Comeau

An article about why spacing and consistency matters in design, and why designers sometimes get annoyed with developers who don't seem to care about this stuff. We've got so many more tools today to get this stuff right in CSS than we did in the past too.

joshwcomeau.com

 

Effective Skeleton Screens - Web Performance Consulting | TimKadlec.com

Some good thinking on the subject of skeleton screens, and how to use them well.

timkadlec.com

 
 

Our Sponsor

 

Articles, Links, and Tools from An Event Apart Online Together: Fall Summit

An Event Apart just wrapped up their Fall Summit conference, and it was a huge success! Attendees and speakers from around the world took in dozens of inspiring sessions full of deep insights into where we are now and where things are going next.

If you weren’t able to participate, don’t worry—we’ve got your back! Start by exploring the compendium of articles, links, tools, and other resources from 20+ experts.

Next, boost your skills and inspire your creativity with a Fall Summit On-Demand Pass.

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

 
 
©2020 CSS Layout News | Privacy Policy | Curated by Rachel Andrew.
 
Published with Curated

Older messages

CSS Layout News - Issue 275

Tuesday, November 3, 2020

Masonry, content-visibility, and hiding things with CSS View on the Web Archives ISSUE 275 3rd November 2020 News Issue 275 I'd seen a few people mention the publication of a Grid Level 3 draft

CSS Layout News - Issue 274

Tuesday, October 27, 2020

A grid solution to layout shifts, CSS Shapes and emoji, grid sites that don't look so griddy. View on the web Archives ISSUE 274 27th October 2020 News Issue 274 Hello! Here we are with another

CSS Layout News - Issue 272

Tuesday, October 13, 2020

Interesting techniques with grid, subgrid, flexbox, and custom properties. View on the web Archives ISSUE 272 13th October 2020 News Issue 272 Late sending this today as I've had one of those days

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,

You Might Also Like

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! ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏