Comparing visual artifacts can be a powerful, if fickle, approach to automated testing. Playwright makes this seem simple for websites, but the details might take a little finessing. Recent downtime prompted me to scratch an itch that had been plaguing me for a while: The style sheet of a website Read more…
I came across this awesome article navigator by Jhey Tompkins: CodePen Embed Fallback It solved a UX problem I was facing on a project, so I’ve adapted it to the needs of an online course — a “course navigator” if you will — and built upon it. And today I’m Read more…
There’s a bit of a blind spot when working with CSS logical properties concerning shorthands. Miriam explains: Logical properties are a great way to optimize our sites in advance, without any real effort. But what if we want to set multiple properties at once? This is where shorthands like margin and padding become useful. Read more…
In my last article on “Revisiting CSS Multi-Column Layout”, I mentioned that almost twenty years have flown by since I wrote my first book, Transcending CSS. In it, I explained how and why to use what were, at the time, an emerging CSS property. Ten years later, I wrote the Read more…
I’ve seen a handful of recent posts talking about the utility of the :is() relational pseudo-selector. No need to delve into the details other than to say it can help make compound selectors a lot more readable. :is(section, article, aside, nav) :is(h1, h2, h3, h4, h5, h6) { color: #BADA55; Read more…
The videos from Smashing Magazine’s recent event on accessibility were just posted the other day. I was invited to host the panel discussion with the speakers, including a couple of personal heroes of mine, Stéphanie Walter and Sarah Fossheim. But I was just as stoked to meet Kardo Ayoub who Read more…
In the last article, we created a CSS-only star rating component using the CSS mask and border-image properties, as well as the newly enhanced attr() function. We ended with CSS code that we can easily adjust to create component variations, including a heart rating and volume control. This second article Read more…
Manuel Matuzović: That an invalid custom property invalidates the entire declaration isn’t surprising, but I didn’t consider it until I saw one of my declarations break. I guess it’s just good to know that, especially if you’re working a lot with custom properties. This easily qualifies as a “gotcha” in Read more…
A much-needed disclaimer: You (kinda) can use functions now! I know, it isn’t the most pleasant feeling to finish reading about a new feature just for the author to say “And we’ll hopefully see it in a couple of years”. Luckily, right now you can use an (incomplete) version of Read more…
The Y2K aesthetic is back and it’s taking over fashion, graphic design, and even our digital spaces. It’s nostalgic, futuristic, and chaotic all at once. But what makes this turn-of-the-millennium aesthetic so appealing in 2025? And how can you incorporate it into your own designs? Let’s dive into the world Read more…
