That wouldn’t fly in any other language.
In other words, CSS class names are the new global variables. I like that framing. Everything old is indeed new again.
However scoped css variables does add quite a lot. So I'm thinking that can't be the scoping you were thinking of?
That said, don't blame CSS just because React treated it like a second class citizen. Try Svelte. Matches the components there perfectly. It really is amazing to use a web framework that doesn't hate the platform it's written for.
I struggled with letting go of old school CSS for this reason. I’ve written it for literal decades at this point and know it like the back of my hand, and it increasingly just feels like the odd man out in the front end stack.
I am puzzled by this statement. The cascade is the algorithm for resolving conflicts when multiple rules apply to the same HTML element (based on css rule position, specificity, origin, and importance). Inheritance in CSS is a different topic, where a subset of properties defined on the parent are automatically applied to the children. Without inheritance, you would have to redefine the same properties on each of the children (e.g. the body font-size, or font-family, or color would have to be repeated on each of the children elements). Without cascade, the browser wouldn't know how to resolve conflicting rules. How is any of this out of place?
Not the commenter you responded to, but I'm guessing they meant "inheritance" as a programming practise, not the CSS-specific meaning.
Inheritance of CSS rules down the DOM tree is indeed essential for CSS to work, even if you are using some sort of scoping.
Scoping is about limiting the DOM subtree that a CSS rule applies to, so sure it is related to CSS rule inheritance.
But even if you use tailwind, (Vue) scoped styles or styled components, you still need CSS inheritance.
Nobody aims to apply CSS per-element only, although large parts of it are exactly that. In other words, Tailwind authors stil expect "text-red-500" to be inherited down to child elements.
so much for inheritance, regarding the cascade:
Point of maintable CSS is to keep the cascade flat and avoid multiple levels of overrides or very specific selectors.
Yes, that is what I meant. Thanks for jumping in and clarifying. :)