3 ms·
Eh. I kinda hate writing separate selectors just for a `:hover` I agree CSS has come a long way. Nested CSS is the one thing I'm waiting for before I completel
by culi 4y ago
Eh. I kinda hate writing separate selectors just for a `:hover`
I agree CSS has come a long way. Nested CSS is the one thing I'm waiting for before I completely abandon preprocessors.
Think about the amount of characters wasted on having to write a whole separate rule to add a hover effect or something similar. Sure, better practices could usually make this unnecessary, but there's definitely valid situations for it. If you add up all the extra kb across millions of sites, and all the extra savings minifiers would be able to achieve with this syntax, I'd bet it starts to add up at a certain point
I was sad to see it left out of 2022-interop, but it's definitely the biggest feature I'm waiting for
- alwillis 4y ago> I was sad to see it left out of 2022-interop, but it's definitely the biggest feature I'm waiting for My understanding is the features for Interop were chosen because there wasn't good interoperability between browsers for them. With CSS Nesting, once the spec (and the syntax) is finalized, it's going to work the same in all browser engines; hopefully it'll go smoothly and we won't need CSS Nesting be part of Interop 2023.
- culi 4y agoCorrect. I meant the "2022 Investigation" section of it which accounts for 10% of the grade and focuses on future features
- toastal 4y agoI wouldn't disagree. Nesting state and pseudo selectors can clean up code.
- hypertele-Xii 4y ago> Think about the amount of characters wasted on having to write a whole separate rule to add a hover effect or something similar. So... 20 bytes or so? A whopping 20 megabytes per a million websites. Seems like a very, very, very small optimization.
- eCa 4y ago20 bytes per rule. While not a fan of the syntax[1], there’s the advantage when reading of seeing that rules are explicitly nested versus doing string parsing of rule definitions. [1] In particular the significant space char difference between &. And & .
- hypertele-Xii 4y agoWhy does a website need more than one :hover rule?
- extra88 4y agoAt minimum, you'll likely have different effects for links than for buttons. Component-centered design is very common so the styles for each component that would benefit from :hover may have its own variation on it, for the color differences if nothing else. :hover is not the only interaction pseudo-class, :focus and :active can also be nested.
- interstice 4y agoEvery pseudo class * everything that needs that pseudo class * time taken to write/reason/check each one