Please name your favourite I-used-to-do-this-with-JavaScript-but-now-I-don't-need-to CSS properties/functionalities.
Discussion
Loading...
@ppk coming up: field-sizing https://caniuse.com/?search=field-sizing
"The field-sizing CSS property allows form controls such as <textarea> to be sized based on their content."
Right now auto-growing an input box with the content inside it requires some artful CSS layering and a sprinkle of JS
https://css-tricks.com/the-cleanest-trick-for-autogrowing-textareas/
@ppk dialog and popover stuff: way less JS needed
@ppk View transitions between different server-rendered pages. It sometimes means you can do stuff that looks like JavaScript on the server altogether, which makes everything better.
@ppk Scroll Snap. Mostly eliminated the need for js when building carousels.
@ppk Uh, favourites… there are so many.
position: sticky;
:has() and other pseudos
animations (even scroll-based)
color functions, especially relative colors
all kinds of math functions
view transitions
CSS Grid, obviously
@polarbirke Why grid? What JS does it replace?
@ppk so much! Not a favourite like you asked, apologies, but you got me reminiscing that I *think* it all started with anything that :hover gives us, eg rollovers
@ppk Focus styles for more complex components previously sometimes required setting some classes or similar on strategic elements so you can use them selectors. Now, with :has(), that's generally not needed anymore.