Today is the last day to get early bird pricing for the Poetic CSS course! Learn to write & review CSS with confidence. The first module is live, with more coming through the summer & fall. Get the full course as it's ready, without waiting to pay full price: courses.oddbird.net/poetic-css/ #CSS

Poetic CSS

Understand CSS as a system — so you can write, review, and maintain web styles with confidence on a timeline and under budget.

courses.oddbird.net

Very much looking forward to more of this. The first issue is fascinating!

king lola 👑@lolaodelola.bsky.social · 2w ago

Could the web have been created in Yoruba Land? I've been thinking about Ifá as an information system, the colonial impact on Nigerian technologists & what gets lost when a Western web as the only web. Read my first issue of my new newsletter, If Not This: docs.google.com/document/d/1...

I was curious to recreate those scrolly collapsing World Cup brackets I've been seeing, and it's fairly straightforward with anchor positioning, scroll snap, and scroll triggered animations. codepen.io/jamessw/pen/... (Chrome 150+ only)

World Cup Bracket 2026

...

codepen.io

I want to make an iframe a popover, something like <iframe popover loading="lazy">. Then each tooltip can be its own document. But content is no longer accessible by keyboard, unless you wrap the iframe in a div that is the popover.

This is a great write up. (And as tech support for the anchor positioning polyfill, the disclaimer about not being tech support for the polyfill made me laugh out loud)

Adrian Roselli, pH0@aardrian.bsky.social · 4w ago

“Link + Popover Navigation” adrianroselli.com/2026/07/link... It uses HTML `popover` instead of disclosure widgets in a web site nested navigation bar. Tried my best for anchor positioning that uses logical properties to account for assorted languages as well. #HTML #CSS #accessibility #a11y

Updated my slidy-collapsey bracket with the latest result!

James Stuckey Weber@jamessw.com · 4w ago

I've been in "Can it work in 8-year-old browsers?" mode, so I decided to see what I could do with some of the newest things. Scroll-animated border-area gradients? Squircles? Anchor positioned node connections? Try it in Chromium 150+.

I've been in "Can it work in 8-year-old browsers?" mode, so I decided to see what I could do with some of the newest things. Scroll-animated border-area gradients? Squircles? Anchor positioned node connections? Try it in Chromium 150+.

World Cup Bracket 2026

...

codepen.io

Just published a blog post about the new CSS Anchor Positioning API! ⚓ I’ve been learning about it over the past few weeks, and it’s friggin’ great, but it also took me a minute to really get the hang of it. My goal in this post is to share the most useful bits, so you can start using it today. 🔥

Getting Started with Anchor Positioning • Josh W. Comeau

For decades, one of the most notoriously-challenging problems on the web has been sticking one element to another element, for things like tooltips and nested menus. The CSSWG has decided to provide a...

joshwcomeau.com

I consider myself a person who knows a lot about CSS... but @miriam.codes' knowledge eclipses mine by ~10,000%. She brings an artistry to the discipline of authoring CSS and I'm sure anyone – whether newbie or old-timer like myself – can learn a lot from her course.

Mia [data-css=poetic]@miriam.codes · last mo.

Poetic CSS course is live for early-bird registration! Only available during July. Thanks for your patience, we had some last-minute fixes. #css courses.oddbird.net/poetic-css/

Poetic CSS course is live for early-bird registration! Only available during July. Thanks for your patience, we had some last-minute fixes. #css courses.oddbird.net/poetic-css/

Poetic CSS

Understand CSS as a system — so you can write, review, and maintain web styles with confidence on a timeline and under budget.

courses.oddbird.net

🎤 Speaker Spotlight James Stuckey Weber joins DjangoCon US 2026 with: "But did you know the browser already does that?" Learn how modern browser capabilities and tools like Baseline can help you build more with less JavaScript. #Django #Python #WebDev

In urgent need of funds. If you know of anyone looking for contract/freelance web development work please send them my way! I specialize in accessibility, design systems, & documentation. Open to full stack as well! Email: inquiries@semanticfish.com Website: semanticfish.com

Heyo! I am officially open to new opportunities. If you stumble across something you believe I would be a good fit for, please let me know. Thanks so much 🙌

This Thursday, @stacykvernmo.com and I will Wing It live, looking at #CSS grid-lanes (now in WebKit/Safari). Neither of us have had a chance to actually play with it yet, and we're excited to see how it works. Come learn with us! youtube.com/live/siSCSaq...

Grid Lanes: the Future of Masonry Layout

YouTube video by Winging It

youtube.com

Sure, I could carefully develop a plan for introducing allergens to the baby, or I could put them all in a smoothie for the 5 year old to accidentally spill on the baby.

I'm sad to miss you all at #CSSDay this year! Wish I could be there, and see all the great talks. In the spirit of the event, I'm launching my new #CSS course – Poetic CSS! The first module is ready, and early bird tickets will go on sale for the month of July. courses.oddbird.net/poetic-css/

Poetic CSS

Understand CSS as a system — so you can write, review, and maintain web styles with confidence on a timeline and under budget.

courses.oddbird.net

Might be playing too much ultimate frisbee... just wrote "backend and foreend".

I’m curious- anchor positioning usage has jumped up about 5x in the last 2 months based on Chrome stats and polyfill downloads. Any ideas why now?

I'm excited that I've been selected to speak at DjangoCon this year! I'll be there to share a few of the many new things browsers can do natively like popovers and view transitions, and how to know if they are ready to use.

djangocon.us@djangocon.us · 2mo ago

Announcing Our Talk Lineup! We're excited to share this year's talks covering Django, AI, PostgreSQL, HTMX, testing, deployment, open source, and more. Congratulations to all of our speakers, we look forward to seeing you in Chicago this August! 2026.djangocon.us/news/announc...

In 45m (11am MT) I'll be Winging It with @stacykvernmo.com for a look at #CSS shorthands, how they work, when to use them, and some ways they might surprise you. It's a side-quest that will be bonus material in my upcoming course – early bird signup available soon! www.youtube.com/watch?v=NX7E...

Surprising Effects of CSS Shorthands

YouTube video by Winging It

youtube.com

You have a site that you want to build or redesign. Maybe you have a few core colors in mind, and you’re thinking about how to quickly implement a theme based on those colors. Baseline features can help! www.oddbird.net/2026/05/14/b... In May OddNews mailchi.mp/oddbird/fast... #CSS

Color Themes with Baseline CSS Features

So, you have a site that you want to build or redesign. Maybe you have a few core colors in mind, and you're thinking about how to quickly implement a theme based on those colors. Baseline features ca...

oddbird.net

There's actual gamut mapping of wide-gamut colors in Firefox Nightly- I'm going to play around with it a bit and see how it's working. It's in Firefox Nightly 153, by setting layout.css.gamut-mapping.method to 2.

I still think we need the choice! Sucks both ways if it’s a binary state; vibrancy for gradients or mapping for calculated a11y contrast not having both to choose seems only limited by ability to articulate, not calculate. Also, lovely post and studies. A good read.

There's actual gamut mapping of wide-gamut colors in Firefox Nightly- I'm going to play around with it a bit and see how it's working. It's in Firefox Nightly 153, by setting layout.css.gamut-mapping.method to 2.

You'll never believe this one crazy trick to drive up session length and retention...

QuirksBot@quirksbot.bsky.social · 3mo ago

[[WebKit]] claude.ai: Quirk to work around chat stuck in infinite reload loop after logout https://bugs.webkit.org/show_bug.cgi?id=315164 The Claude SPA's logout flow uses fetch('/api/auth/logout') to log the user out. The server response clears the auth cookies, but leaves several identificati...

[[WebKit]] [threaded-animations] disable Threaded Time-based Animations on CNN.com on iOS https://bugs.webkit.org/show_bug.cgi?id=315099 We're hitting some jetsams on iOS for cnn.com when Threaded Time-based Animations are enabled. Until we fix those, disable this feature on that site. (WebCor...

[threaded-animations] disable Threaded Time-based Animations on CNN.c… · WebKit/WebKit@8b0c7d7

…om on iOS https://bugs.webkit.org/show_bug.cgi?id=315099 Reviewed by Tim Nguyen. We're hitting some jetsams on iOS for cnn.com when Threaded Time-based Animations are enabled. Until we fix ...

github.com

This week's Design Systems News has no sponsor … so I'm taking the slot for myself 😄 When I'm not curating the newsletter, I'm a front-end developer & Design Systems consultant Currently looking for new client work Get in touch: stu@alwaystwisted.com read the newsletter: news.design.systems 🙏🖤

[[Firefox]] - add a CSS webcompat intervention for snowplowmap.a2gov.org; Differential Revision: https://phabricator.services.mozilla.com/D298952

Bug 2012760 - add a CSS webcompat intervention for snowplowmap.a2gov.… · mozilla-firefox/firefox@3961e3f

…org; r=ksenia,webcompat-reviewers Differential Revision: https://phabricator.services.mozilla.com/D298952

github.com

Inspired by @denodell.bsky.social's post on browser quirks, I present QuirksBot! bsky.app/profile/quir...

[[WebKit]] Add site-specific quirk to make anchor elements mouse-focusable on thesaurus.com and dictionary.com https://bugs.webkit.org/show_bug.cgi?id=312692 Clicking links on thesaurus.com and dictionary.com causes blur events with a null relatedTarget, breaking dropdown menus that rely on rel...