Anchor positioning is now available in Firefox! If you've been holding off on learning it, now is a great time to dive in. Sign up for my free email course to learn how to use this powerful tool today. https://oddbird.dev/courses/anchor-positioning/
James
Web Developer, birder, and home brewer
This will be chock full of gems that you can start using, like yesterday. https://www.youtube.com/live/XOm3vEJMe_U
The fact that `anchor()` is a length gives it superpowers, but it has some limitations. Join us on Thursday to hear more!
https://youtube.com/live/OEvVW4wQUII
Anchor positioning is great, until it isn't. Join us for a live stream with some of the tips and learnings that have been rattling around my head.
Looking forward to learning about CSS scope and mixins from @chriscoyier@front-end.social with @mia@front-end.social and @stacy@front-end.social on Winging It Live- Thursday at 1 ET.
https://youtube.com/live/T-X641Qn-Rc
The more I play with anchor positioning, the more convinced I am that it's going to unlock some surprising new layouts. Here's a responsive yearbook-style photo layout with no JavaScript.
https://www.oddbird.net/2024/11/18/anchor-position-yearbook/
Anchor positioning is undeniably awesome. What is missing from our list? https://github.com/oddbird/awesome-anchor-positioning?tab=readme-ov-file
Curious how 'position-area' works? It's more than a shorthand for anchor(). https://oddbird.dev/2025/02/25/anchor-position-area/
I've joked that Baby Stuckey Weber is competing to get released before Anchor Positioning goes Baseline, and with 22 hours to go for Firefox 146, it's going to be a tight race. Hoping for a smooth rollout!
I'm excited to dig into the how and why of #CSS anchor positioning, with @mia@front-end.social and @tabatkins@mastodon.social.
Join us- we'll be Winging It live on Thursday at 1pm ET / 10am PT
youtube.com/live/3vwruYb9du4
Well drat, I have an article half written with some great examples, only to discover Firefox doesn’t yet support an input range thumb (`::-moz-range-thumb`) as an anchor.
It may not fix this issue, but I can’t wait for @utilitybend@front-end.social’s work to standardize range inputs to get adopted. https://open-ui.org/components/enhanced-range-input.explainer/#styling-api
I was unprepared for the number of asteroids in dinosaur books and crafts for kids.
What questions do you have about Web Features and Baseline statuses?
@mia@front-end.social and I will be going live in 3 hours to talk about this new way of thinking about whether a feature is ready for production. Sign up to get notified here- https://youtube.com/live/3dLbTHKZHlI