← Back to context

Comment by vazark

20 hours ago

IMO, Tailwind is just inline CSS with standardised defaults. I think it found its place because most React devs didn't want to bother with CSS

It found its place because working on CSS on any non-trivial scale with multiple engineers is painful. The best way to deal with CSS at scale is not to write CSS. And this comes from me who really likes CSS.

  • CSS was prob great for early web but now it's just a pig with lipstick on

    • CSS is one of my favourite things to do and still is. However, most engineers don't really understand it because most engineers don't really bother learning anything, and as a result you typically end up with a mess.

      If someone knows what they are doing and is allowed to make a decent UI library, you can have very clean, efficient styling without libs.

Oh why can't this idea die, it has been continuously debunked for 6 years now. So much so, any TW discussion will reiterate it.

  • Why would it die? How would it die? The vast majority of Tailwind is literally just shorthand for individual CSS properties.

    • Because what makes it useful , like media queries, can't be put in style attributes. Frankly this whole discussion is just as silly as claiming flex has nothing over table layout.

      7 replies →

  • > Oh why can't this idea die

    People like to feel superior to others, so dunking on people using a popular technology tickles some pleasure centers. Considering another viewpoint gets in the way of that, so other viewpoints are ignored.

It's inline CSS, but with all the limitations of inline styles removed. There is a lot of stuff that can't be done with inline styles, like media queries.

It was/is inline styles, not inline CSS. It isn't a stylesheet at all, just a single style property.

It is used because UI component frameworks make vanilla CSS an awkward an unnecessary tool (the Cascading part). CSS makes sense as designed for styling a document, but not so much for styling atomic components. If we were designing the web and CSS from scratch around the React model, CSS would not be made to cascade, because that is totally unnecessary and usually leads to more issues than it solves. Apart from theme variables, in a component system there's no reason to have global CSS anywhere; you'd just style each component in isolation. So when in the React model you typically want no cascades at all, the library that is made for that gets popular.

CSS modules are also a solution to the above, but, once you get rid of cascading, and you have one stylesheet per component, it is again unnecessary to have the one stylesheet in a different file from the one component. There's no benefit to splitting a component and its styles into two files; it just makes it more annoying to edit. So we move the styles essentially inline, with either Tailwind or CSS-in-JS.

  • Thanks for this great explanation of your viewpoint. As an occasional frontend dev who really got into Tailwind, it was always hard for me to explain why I'm so much more productive in Tailwind than in writing CSS. This makes a lot of sense.