Issue 255

News

Issue 255

Online conferences and meetups are really becoming a thing. I presented yesterday at An Event Apart, and the slides are below. Later this week I'll be presenting at the Fronteers online meetup, which is open to everyone whether you are a Fronteers member or not. Come along!

Lots of interesting stuff to read in the newsletter today, I hope you find something useful there.

Rachel Andrew, CSS Layout News

Learn

Now You See It: Understanding Display

I spoke last night at the first An Event Apart Online Together. My talk is all about the display property and you can find the slides, code, and resources here.

noti.st


CSS :is() and :where() are coming to browsers | Web Platform News

An explanation of the is() and where() pseudo-classes.

webplatform.news


Accessibility — Smashing Magazine

A new Smashing Guide, pulling together some of our content on a topic. This time our relevant content on accessibility.

smashingmagazine.com


How to Create a Motion Hover Effect for a Background Image Grid | Codrops

This effect looks very cool, however you might want to wrap it in a  prefers-reduced-motion media query (which you can also use from JavaScript), as I can imagine some folk finding it unpleasant.

tympanus.net


Striking a Balance Between Native and Custom Select Elements | CSS-Tricks

A comprehensive article showing how to enhance a select element to show a styled select.

css-tricks.com


A Guide to the Responsive Images Syntax in HTML | CSS-Tricks

A useful guide to using Responsive Images on CSS Tricks.

css-tricks.com

Interesting

Sorted CSS Colors

A tool that lets you explore the CSS named color values.

enes.in


CSS Grid: Newspaper Layout

Another lovely piece of work from Olivia, this one also uses some multicol which makes me happy to see.

codepen.io

Our Sponsor

Earlybird pricing! Learn CSS layout with me.

I've been completely rewriting and re-recording my CSS Layout course. You can learn Grid, Flexbox, browser support and much more by coding along with me in these lessons.

The first lessons are now online and if you sign up for the complete course with code EARLYBIRD, you will get a $40 discount and be first to see all of the new material as soon as it goes online.

thecssworkshop.com