All you need to know about my college experience 20 years ago is that the campus security guard still remembers my name, even though I was never caught.

For spacing values on a website – is it better to respond to font-size, or available space, or stick with static units? You don't have to choose! Sometimes the best unit in #CSS is a combination – with calc()/clamp() or min()/max() or round() & other math functions. www.oddbird.net/2025/09/23/t...

Color fonts are really interesting. You can see the font-palette options using a tool like wakamaifondue.com or the type designer's site is often helpful. You can even animate between font-palettes codepen.io/stacy/pen/vE... Unfortunately, COLRv1 has limited support caniuse.com/colr-v1

Good bird migration the last couple nights, but managed to botch recording both nights. Ah well, I took a nice walk in the woods and saw a few warblers and thrushes.

The WebDX Community Group is hosting an AMA on the r/webdev subreddit tomorrow. This is the group behind the "State of ..." surveys and Baseline, so if you have questions about those initiatives—or anything else around developer experience, join us! web.dev/blog/baselin...

I have a CSS workshop coming up soon at @smashingconf.com in NY, where we'll talk more about units & layouts & naming conventions – using Poetic CSS: smashingconf.com/ny-2025 I'm also working on a video course, and happy to send you updates if you're interested: www.oddbird.net/courses/desi...

Oh fun, Voiceover reads the `menuitem` ARIA role as mah-NEW-adum.

While making an update to a course chapter that includes the use of CSS-generated content in the accName computation, I noticed that support for alt text in CSS has improved since I gave a talk about CSS & a11y at CSS Day last year. So I thought it's time to do a proper, long overdue writeup!

Tip: When you're using anchor positioning, consider how scrolling or screen size might make your positioned element overflow, and then add a backup with `position-try`. Get more tips by signing up for my free weekly course on anchor positioning!

Curious about what we do on the WebDX community group (i.e Baseline and web-features)? We're organizing a Reddit AMA on Thursday. Ask your questions here: www.reddit.com/r/webdev/com...

I had about 600 warbler call detections overnight, with 38 calls in just 30 seconds. #nfc #migration #birds

I've been using a "follow-the-leader" pattern with CSS anchor positioning lately so I decided to write about it! You set up a "follower" element and dynamically update the anchor on an event/state. Surprisingly simple and effective. Read more with demos!: 👀➡️ una.im/follow-the-a...

In the latest Winging It, @miriam.codes & @stacykvernmo.com chat with #CSS expert @kizu.dev about how to create reusable and flexible CSS using mixins & functions, what happened in the CSSWG meetings, and what's coming in CSS! www.oddbird.net/2025/08/27/w... If you like the show, please subscribe!

This was such a fun project to work on!

Have you played with `anchor-size()`? It's more flexible then `anchor()` and can be used for sizing and margins in addition to the inset. It's been fun to play around with and make demos like this but I'm curious- what use cases have you found for it?

There are tools for generating responsive type in CSS, but the result is a clamp() function with mysterious numbers. @miriam.codes explores what those numbers do with her visualizer using #CSS gradients. Level up your CSS with more free demos like this in your inbox! www.oddbird.net/oddnews/

Tailwind class names are too short. I would much prefer the ergonomics of "align-self_end" over guessing which part of the property name gets dropped...

We mentioned on Winging It that we might show some of our favorite browser tips. Here's one of many that I find delightful. If you are working with shape-outside, then Firefox has a great path editor. I made a quick video to show how it works.

Please stop inheriting the box-model. The supposed use-case for that is extremely out-dated, inheritance doesn't really help, and it actively makes real box-sizing use-cases more difficult! This #CSS best practice was never the best to begin with: www.oddbird.net/2025/09/04/b...

Composition with the Shadow DOM is more powerful than you think. You can do a lot with the default named slot assignment, but manual slot assignment is a pathway to many abilities some consider to be… unnatural.</emperor-palpatine>

Tip 1: If you're using anchor positioning in a reusable component, add an anchor-scope to the component to help your positioned element find the right anchor. Tip 2: Sign up for my free email course on anchor positioning .

This demo helped me visualize how `position-try` works in CSS Anchor Positioning. It was so much fun to design & build! 😄 Learn more in the article: ishadeed.com/article/anch...

Not yet baseline, but part of Interop 2025 so should soon reach baseline "newly available". Now is a good time to adopt anchor positioning (with the polyfill) in place of JS calculations, and then just remove the polyfill when anchor positioning reaches your baseline threshold.

Almost everything I know about anchor-positioning is thanks to James' articles on it, and this email course. It's definitely worth learning (I still get excited with how easy it makes a lot of things), and this is as good a resource as you'll find on the topic.

Anchor positioning is not yet baseline, but you can use it in production with a polyfill - anchor-positioning.oddbird.dev (and in fact, we're using it on oddbird.dev). If you're curious about anchor positioning, now is a great time to learn, and my email course will help you dive deep!

My policy of "wait until Ahmad writes about it before you try to fully understand it" paying dividends again ishadeed.com/article/anch...

I'll be Winging It live with @kizu.dev & @stacykvernmo.com in an hour (11am MT) to talk about future #CSS features like mixins, functions, and masonry! youtube.com/live/ER4APBN...

I went down a rabbit hole trying to understand and visualize how fluid typography calculations work in #CSS. Here's a video and interactive codepen with the results: www.oddbird.net/2025/08/26/t... Adjust the values to see how they impact the rate of change, the viewport-size range, and page zoom!

Today's lunch video is "Cascading Layers of !mportance" - "Cascade Layers are now widely available, with the potential to fundamentally change how we think about the cascade and how we collaborate across design systems, component libraries, & third-party tools." #CSS www.youtube.com/watch?v=4Pkh...

I wanted to play with some CSS trig functions and found you can calculate the width of a scrollbar in CSS when using container queries and registered custom properties. There’s so much more you can do, but here’s a little demo: codepen.io/stacy/pen/Qw...

Any other OSS contributors getting recruited to do annotations and labeling work for AI coding tools? :backing away slowly:

MDN just got a glow-up! 🌟 We’ve completely rebuilt our front end, redesigned, reengineered, and ready to help you find what you need. ✨ New search ✨ Improved typography & code rendering ✨ Sleeker nav & icons Read more 👇 developer.mozilla.org/en-US/blog/...

With CSS anchor positioning, the anchor() function can be used as a length, so you can use it with functions like round() and mod(). Here's a 2-track abacus, and I'll leave it up to you to add more. My email course covers anchor() and much more- sign up today! oddbird.dev/learn/course...

If you appreciate the features I've helped develop - container queries, cascade layers, mixins & functions, scope, progress, logical shorthands - consider supporting that work though open collective: opencollective.com/oddbird-open... or hire me to teach a workshop: www.oddbird.net/talks/

Last week, Container Queries became baseline widely available. We shared resources to get you up to speed. But if you have limited time to expand your #CSS skills, we recommend focusing on CSS Grids! Playlist www.youtube.com/playlist?lis... CSS Grid in Practice www.youtube.com/live/kQu-bSW...

There are so many CSS features rolling out these days but not enough time to experiment myself with everything. That’s why I’m loving @jamessw.com's arbitrary striped table CodePen demo using the new sibling-index() function codepen.io/jamessw/pen/...
 Currently on Chrome & Edge 138+

When the CSS Working Group gets together for a face to face, the CSS meeting bot is busy and lots of Github issues get updated. If you can't keep up with it all, join Roma Komarov, @miriam.codes and @stacykvernmo.com as they recap the highlights on this month's Winging It.

🎉 Happy 30-month anniversary to Container Queries – in every browser since Feb, 2023. It was supposed to be impossible, but here we are! Why 2.5 years? Nothing will change tomorrow, but Baseline uses this milestone to signal confidence a feature has gained "wide" support. youtu.be/bhHV0rQ3-CQ

✏️ Can components conform to WCAG? hidde.blog/component-co... wrote up some thoughts around claiming conformance about a design system component. Curious to hear what people think

Are you using position-area on a popover? Make sure to unset that margin!

After years of rolling my own standing desk with cinder blocks or random shipping boxes, I'm looking at getting an actual standing desk. Any recommendations?

CSS Working Group gets together in Aug to discuss various issues. Join @miriam.codes and @stacykvernmo.com afterward, on Aug 27, for a chat with #CSS expert ‪@kizu.front-end.social.ap.brid.gy about what's new in CSS, what happened in the meetings, and what's coming! youtube.com/watch?v=ER4APBNgV88

Kid invented reverse ventriloquism, where you move your mouth but don't say anything. As an art form, I prefer it. As a communication method, I can't understand a word he says.

🚨 New Course Alert 🚨 DevTools for Beginners @kevinpowell.co and I just released a brand new (and totally free!) email course all about DevTools and how to use them in ways that actually help you debug and improve your CSS. 🔗 Full details and free signup here: devtoolsforbeginners.kevinpowell.co

When you use position-area, you're actually creating a new containing block for your positioned element. Learn more about how this makes anchor positioning just work in many situations in my email course here - oddbird.dev/learn/course...

Designing for User Font-size and Zoom: "When I tried setting my browser font-size preferences, I found it broke more sites than it improved, and I quickly moved back to the default. So what went wrong, and how can we fix it?" #CSS www.oddbird.net/2025/07/22/s...

Anyone have recommendations for expediting a Google Play Store appeal? I'm working with a client that has been waiting for weeks to hear back.

This was such a good conversation!

Dig into #CSS Container Queries with @miriam.codes & David Herron at OddBird: Container Queries Videos youtube.com/playlist?list=PL4jAKUtAhpHkH3DMK8JNVPDjvKljPkNVU For a Better Web oddbird.net/2025/04/08/better-web-8/ Container Queries: A Quick Start Guide oddbird.net/2021/04/05/containerqueries

In the latest OddNews, @miriam.codes writes about when she tried setting browser font-size preferences, and found it broke more sites than it improved. And @jamessw.com gives an update on the new Vite default. Read Issue 27: us19.campaign-archive.com?e=%5BUNIQID%...