There’s already a style attribute on every html element that does exactly that, and works fine in components.
“There must be something more…?” But it turns out there’s not. Just shorthand class names to save you having to type padding-left:4px
For creativity, I wished I had the time to get really good with css. It really seems to have grown a lot. Using sveltekit, its really easy to get component scoped css
And I was super skeptical about it at first. I almost said no to it, but I trusted our main ui guy and wanted to allow him autonomy. And I ended up loving tailwind after working with it.
There are plenty of other problems Tailwind solves, but these two alone make me never want to go back.
Besides, there recently have been several crucial improvements to CSS to address these pain points. One is CSS layers, which lets define custom layers of specificity that help with the discipline (e.g. resets or some baseline styles go in a low layer, component styles go in a higher layer, and finally overrides end up in the highest layer). The other is CSS scope, which prevents the leakage of the styles. These should greatly help with the specificity issues; and @layer is now sufficiently broadly supported that it is safe to use.
> If you’re writing markup for a component, you have to jump between two files.
Yeah; one of the reasons for my question about the groups in which tailwind saw the biggest growth was that in some ecosystems jumping between files was not a problem to begin with. Vue, for instance, had single-file components, where css could be written in the same file as javascript. So did svelte. So does astro.
What if you need to copy a element with tailwind, this later gets altered to include a slightly different style, but wait, now you have a original somewhere else in your code base, that is missing those updates. So you require the discipline just like CSS to keep things up to date.
Tailwind is great if you use it sporadically ... but have you looked at the source code of so many websites that use tailwind? Often their entire html file is a horrible mess million miles long tags.
I am amazed how often people do not even realizes that CSS supports nested Selectors? With nested Selectors, you get the benefit of creating actual component level structures, that can be isolated and shareable. Yet almost nobody uses them. I noticed that most people lack a lot of CSS knowledge, and they find it hard because they never stepped beyond the basics. Nor do they keep up to date.