Issue 295
Fixing compat pain points, color-mix(), blend modes and masking.
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
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.
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.
Learn
How to create more descriptive button or link text labels to improve the e-commerce experience for screen readers users.
A fast-paced look at building a Settings component with a lot of CSS Grid. There is a video version too.
This is a nice effect and also demonstrates a good use case for @property.
A really detailed dive into blend modes from Ana Tudor.
Interesting
Some nice little transitions to copy and paste or just to poke at to see how they work.