Post

dark 🏳️‍⚧️
@darkswordsman.com

I feel like there might be something I'm missing, because while this is good for showing the technicals of how it works, it doesn't really tell me why it's a valuable thing to have. Maybe I've just been out of the web loop too long.

Firefox for Web Developers
@webdevs.firefox.com

I used this recently in custom select, to pull the label attribute of an optgroup into an inner legend element. Yes, I could write some JS to do the same thing, but doing it in a couple of lines of CSS was much quicker and more reliable.

Craig Francis
@craigfrancis.bsky.social

I’m so glad to see this, but disappointed that URLs for images don’t work. Take a website with a strict CSP, does not allow inline CSS, makes it tricky to add per-page background images (can mess with <img>, but isn’t ideal). Maybe the HTML attr could do something to say it’s safe for CSS?

Amos Manneschmidt
@amoose.org

Looks broadly useful for popping out select css properties into the template so they can be conveniently edited in a Tailwind-like manner, but without using something as huge as Tailwind. Also looks helpful for eliminating some look and feel oriented javascript which is always a good thing.

CSS by T. Afif
@css-only.dev

It would be good to make a short video about the <custom-ident> case that will confuse many people, thinking they are <string> instead. bsky.app/profile/css-...

CSS by T. Afif@css-only.dev

It seems you had the confusion I see a lot. Keyword values are not "string" but "custom-ident" so you can use the value auto (as well as other keyword) like below: [mx] { margin-inline: attr(mx type(<custom-ident>)); } codepen.io/t_afif/pen/p...

codepen.ioUntitled...
rem / Remy Sharp
@remysharp.com

This is very neat, but good lord how many devs are going to be scratching their heads when it's being included but doesn't work. devtools css errors panel coming to a desk near you?! (it's a thing in the inspector, but we'd want this dumped like JS errors)

Firefox for Web Developers
@webdevs.firefox.com

It's tricky because it's common to do progressive enhancement with CSS by embracing fallbacks, so an error panel might become noisy fast. The rules panel will tell you when the attr() rules doesn't match expected syntax though.