CSS Layout News - CSS Layout News - Issue 295

Fixing compat pain points, color-mix(), blend modes and masking.
 

CSS Layout News

 

ISSUE 295  23rd March 2021

 

News

 

Issue 295

Today marks a year since the first lockdown here in the UK, I just had a look back at my intro to the email as we were heading into that lockdown. I am not sure I imagined we would still be here a year later.

However, here we are. Hopefully there is some light at the end of the tunnel, though this virtual life looks set to go on a little longer.

Rachel Andrew, CSS Layout News

 

Compat2021: Eliminating five top compatibility pain points on the web

Google is partnering with other browser vendors and industry partners to fix the top five browser compatibility pain points for web developers: CSS Flexbox, CSS Grid, position: sticky, aspect-ratio, and CSS transforms.

web.dev

 

color-mix() - CSS: Cascading Style Sheets | MDN

The color-mix() function is in Firefox Nightly and Safari TP. It's one of a whole bunch of interesting things that are part of CSS Color Level 4 and 5. I'm working through documenting them for MDN.

mozilla.org

 
 

Learn

 

Accessible Text Labels For All

How to create more descriptive button or link text labels to improve the e-commerce experience for screen readers users.

sarasoueidan.com

 

Building a Settings component

A fast-paced look at building a Settings component with a lot of CSS Grid. There is a video version too.

web.dev

 

Image Fragmentation Effect With CSS Masks and Custom Properties | CSS-Tricks

This is a nice effect and also demonstrates a good use case for @property.

css-tricks.com

 

Taming Blend Modes: `difference` and `exclusion` | CSS-Tricks

A really detailed dive into blend modes from Ana Tudor.

css-tricks.com

 
 

Interesting

 

Transition.css - easy transitions with clip-path

Some nice little transitions to copy and paste or just to poke at to see how they work.

transition.style

 
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
 
 

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

Older messages

CSS Layout News - Issue 294

Tuesday, March 16, 2021

Layout shifts, HSL, content re-ordering with grid, and Safari TP updates. View on the Web Archives ISSUE 294 16th March 2021 News Issue 294 I've been busy finishing off and recording my talk for

CSS Layout News - Issue 293

Tuesday, March 9, 2021

@property, Houdini Paint API, more scroll-linked animations, and indicating the current page. View on the Web Archives ISSUE 293 9th March 2021 News Issue 293 I'm in the middle of creating new

CSS Layout News - Issue 292

Tuesday, March 2, 2021

Grid fixes for Safari, Flex tools in Chrome, hiding content, and accessibility. View on the Web Archives ISSUE 292 2nd March 2021 News Issue 292 Welcome to another issue of CSS "is it really

CSS Layout News - Issue 291

Tuesday, February 23, 2021

Images, shadows, tabs, and Intersection Observer. View on the Web Archives ISSUE 291 23rd February 2021 News Issue 291 I didn't get time to move this list to the new platform last week. I had my

CSS Layout News - Issue 290

Tuesday, February 16, 2021

All about the floats, plus multicol, and container queries news. View on the Web Archives ISSUE 290 16th February 2021 News Issue 290 I am currently working on moving this newsletter to a new platform.

You Might Also Like

#497: Color Palettes and Generators

Tuesday, March 4, 2025

How to fix a broken color palette, accessible color combinations, color names and palette generators. Issue #497 • Feb 28, 2025 • View in the browser Smashing Newsletter Pryvit! Smashing Friends, How

180 / Make your everyday browsing ridiculously beautiful

Monday, March 3, 2025

Product Disrupt Logo Product Disrupt Half-Monthly Feb 2025 • Part 2 View in browser Welcome to Issue 180 Last year I teamed up with two of my close friends on a side project we're all obsessed with

Accessibility Weekly #438: When to Use Lists

Monday, March 3, 2025

March 3, 2025 • Issue #438 View this issue online or browse the full issue archive. Featured: When to use lists for better accessibility "When creating HTML content, using lists appropriately is

High touch recruiting

Sunday, March 2, 2025

Issue 235: Long-lasting candidate experiences ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏

All Compute Must Flow

Sunday, March 2, 2025

“If I don't have that kind of compute on Day 1, I can't breathe." ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏

🐺 Is a trade show is your right next step?

Friday, February 28, 2025

Q&A with Shoppe Objects' founders ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌ ͏ ‌

AD100 Designers on Battling Burnout

Thursday, February 27, 2025

View in your browser | Update your preferences ADPro Get Your Groove Back Most days, working in the design field is creatively fulfilling. But occasionally, in the throes of tight project timelines,

Accessibility Weekly #436: Evaluating Overlay-adjacent Accessibility Products

Thursday, February 27, 2025

February 17, 2025 • Issue #436 View this issue online or browse the full issue archive. Featured: Evaluating overlay-adjacent accessibility products "There's a category of third party products

#495: Accessibility and Inclusive UX

Thursday, February 27, 2025

Accessible fonts, inclusive design patterns, accessibility annotations and how to design for people with ADHD. Issue #495 • Feb 18, 2025 • View in the browser 💨 Smashing Newsletter Bok Smashing Friends

AD Editors Share Their Favorite March Issue Moments

Thursday, February 27, 2025

View in your browser | Update your preferences ADPro Behind the Scenes of Creatives at Home The March issue of AD, dedicated to creatives at home, is here. In her editor's letter, global editorial