Datasheets36 days ago
Post by @mattly@hachyderm.io View on Mastodon
Post by @mattly@hachyderm.io View on Mastodon
Inset `box-shadow` doesn't work directly on image elements. There are work-arounds, but this SVG filter can do it directly. Don't run! There is powerful stuff to learn here through interactive demos.
Artem Zakharchenko: A great “aha” moment for me was when I realized you can use a single signal to remove multiple event listeners!
There are a ton more @media queries than "width" and "prefers-reduced-motion". Let's have a long, along with use-cases.
I admit I’ve never once used a Git Worktree. But Nick Taylor has a pretty good intro that compels me. (Nick credits bashbunni for her own intro). Git worktrees let you check out multiple branches from the same repository simultaneously, each in its own working directory. Instead of constantly switching between branches with git checkout, you […]
One of the dev jobs out there is DevRel or “Developer Relations”. A role like that is very likely going to involve teaching and helping people learn a products API. And, if the company has one, SDK’s around that API. Can you articulate the difference between them? At a minimum, that would be good to […]
A fairly opinionated CSS starter by Chris, following a set of personal principals to guide what is in there and what isn't.
Another good one from Nicholas C. Zakas this time on code portability. Here’s some choices he made for a recent projects: Portability indeed!
If you thought 2024 was packed with amazing new CSS, well, you're right. But so is 2025 and it keeps looking bright. Check out our list of the best stuff with easy-to-reference examples.
The article explains how to design and animate a *circular* menu (that rotates in a circle!) in CSS using offset and animation-composition.
Nice reminder about JavaScript evolving to be more useful from Trevor I. Lasn: The final line there uses what is called the “The nullish coalescing assignment operator assignment operator” in case you need to impress people at parties.
After you've got a `border-radius`, you can control the shape of the corner with `corner-shape`, which unlocks a simpler and more powerful way to make shapes compared to `clip-path()`.
We've got @scope in CSS now, and it's got it's uses. But the concept of scope in CSS is a wider idea.
A fun list post from Nic Chan where you check off the funny/sad/proud/weird things we do as front-end developers. I don’t know if a higher score is better, but it certainly means you’ve been around the block. I doubt you’ll be able to resist poking around Nic’s site, it’s really fun.
This is about reducing banding effects in gradients by introducing noise. A nice approach is a displacement map using SVG filters.
There was a lot of interest in our Why Can’t HTML Alone Do Includes? article. I’d like to point you to my ShopTalk Show conversation where we really get into things more with Jake Archibald.
There are several different ways to do equal width columns. But some are, uh, more equal than others.
Fun idea from the team at Immich: Cursed knowledge we have learned as a result of building Immich that we wish we never knew. Stuff like: Fetch requests in Cloudflare Workers use http by default, even if you explicitly specify https, which can often cause redirect loops.
scroll-timelines go from 0 to 100. Many variable fonts axis have similar ranges, like 100 to 900. Surely that's begging for interplay.
You might as well really understand height and Josh Comeau has your back here. It’s really quite different than width and perhaps less intuitive. Plus when grid and flexbox get involved, things change.