@nerdy.dev just started the new WWW and happy belated birthday!
12.03.2026 08:24
👍 1
🔁 0
💬 1
📌 0
@nerdy.dev just started the new WWW and happy belated birthday!
Build your bracket for the world's first ever CSS tournament, March MadCSS.
Premieres Friday 10ET on YouTube, and the stakes are high.
win over $1,500 worth of prizes madcss.com
The Madcss.com bracket challenge is LIVE.
HUGE Prizes just for picking the right bracket.
Puck who you think will win the massive 2026 CSS tournament!
Had the same issue cc @tolin.ski
16 developers.
15 minutes.
Single elimination.
Round 1 begins March 6.
Who do you think is taking it all?
Fill out your bracket now at madcss.com
€50 on @miocene.io to win it all
🎉 Looking for new work.
15 years front-end dev + Design Systems specialist.
I help folks build, maintain & transform design systems.
I'm also available for focused projects, front-end builds, codebase modernisation.
Short to long term.
Let's chat - stu@alwaystwisted.com
reposts appreciated <3
✨ I just published a new blog post about a nifty lil’ animation technique: sprites!
Sprites are used all the time in video games, but they’re less common on the web. We do have the tools to manage it in CSS, but there’s a gotcha.
In this post, I share some of the cool use cases I’ve found:
HTML might be getting a new type of tag, which… hasn't happened this millennium. Here's the new syntax, and how it works:
Newly Available: CustomStateSet ✅
What is it? 🤔
It’s a new API that lets developers define and manage custom states on HTML elements, enabling fine-grained styling and behavior control using the :state() CSS pseudo-class.
Start experimenting now 👇
developer.mozilla.org/en-US/docs/...
FLIP animations in pure CSS? @nerdy.dev figured it out.
AIM = Anchor Interpolated Morph
CSS Anchor positioning + starting-styles = element morphing without JavaScript.
🎧 whiskey.fm/230
@nerdy.dev yo, just listened to the latest 🥃, have you written anything about AIM yet? Would love to see some code.
Overview of the CSS code from the provided link
💡 CSS Tip!
Have you ever tried to use "auto" within clamp()? Unfortunately, it doesn't work, but it's now possible using the new calc-size()!
css-tip.com/clamp-auto/
The same applies to all the sizing values (min-content, max-content, fit-content, etc.)
there’s never been a better time to switch to Progressive Web Apps on your phone, from Apple’s out-of-control fees, to removing public safety apps like ICEBlock, to apps accessing more of your data than you realize. odds are that “native” app is just a webview anyway 😉
www.pcmag.com/explainers/h...
It is a lot more complicated to add keyboard shortcuts to your web app than you might initially think, featuring a big honkin' table. #a11ty ericwbailey.website/published/ho...
@ishadeed.com would crush it
3
Behold, the end of year developer. An unflinching look at the survival period of "working" during the holidays.
www.youtube.com/watch?v=ps06...
AI’ is becoming shorthand for ’We don’t care if it works, we just don’t want to pay people to do it properly.’
www.bbc.com/news/article...
👉 I made a little tool for creating Toon Text using CSS: stuffandnonsense.co.uk/toon-text/to...
We had a lot of fun building this one.
We left an Easter egg in the form of a secret achievement. So far nobody has found it…
Looks awesome, congrats! Can’t wait to play with it on desktop, found this small annoying bit of UX on mobile. I remember reading recently about the use of ‘inert’ for this scenario.
Again, congrats, it’s freaking amazing!!
Tired of hacking together deep copies with JSON.parse(JSON.stringify(...))? 🔁
The structuredClone() method lets you safely clone complex JavaScript objects.
No data loss. No surprises. Just clean, reliable cloning.
Learn more 👇
developer.mozilla.org/en-US/docs/...
“But they have built it in BLANK” as if it was something easy to replicate ignoring any and all technical complexity.
HTML: ``` <!-- ❌ DON'T DO THIS 🚫 --> <section> <h2>Classic</h2> <img src='classic-bar.png' alt=''/> <h2>Flavour</h2> </section> <!-- ✅ DO THIS ✅ --> <section> <h2> <span>Classic</span> <span>Flavour</span> </h2> <img src='classic-bar.png' alt='the classic chocolate bar'/> </section> ``` CSS: ``` section, h2 { display: grid } section { grid-template-rows: repeat(3, auto) } h2 { grid-area: 1/ 1/ span 3; grid-template-rows: subgrid; span:last-child { grid-row: 3 } } img { grid-area: 2/ 1 } ```
I am begging you, please don't split your heading into two separate `h2` elements with an `img` in between just to have the image in between your heading words.
This is what subgrid was made for!
#CSS
The AI centipede
Best diagram of the AI bubble I've seen so far 😁
Unasked context: I was just reading @bell.bz’s take on @chriscoyier.net’s reset/starter and thought of it. Thanks once again!
Thank you!!!
