Live data from Hacker News

Moving away from Tailwind, and learning to structure my CSS

jvns.ca

231–240 of 435 posts

Re: Moving away from Tailwind, and learning to structure my CSS

#231

Earlier quoted context omitted.

Global styles are like global state in software: They're best avoided.

So no CSS files at all? Only inline styles?

Well I mean styles that are actually global I put into CSS, but it’s generally not too much

Re: Moving away from Tailwind, and learning to structure my CSS

#233
post #225
post #193

Earlier quoted context omitted.

Premature optimisation doesn’t even fully express how absolutely ridiculously futile it is to try and make your website faster by having fewer CSS selectors. It’s like my grandparents worrying about immediately switching off their LED ceiling lamps when they leave a room - meant well, but utterly meaningless.

If this was the case, it wouldn’t take several seconds to open devtools on sites that use Tailwind.

That is only the case for sites that include the entire, unpruned Tailwind Stylesheet with all utility classes. That’s a choice…

Re: Moving away from Tailwind, and learning to structure my CSS

#234
post #54

Earlier quoted context omitted.

you're unfairly conflating things and putting the blame for a lack of care or understanding on tailwind vs on the dev themselves. nothing about tailwind forces you to build inaccessible or "div soup" apps can tailwind be used poorly? absolutely. but that's true of any tool i've been writing CSS for ~20 years and am quite capable with it, having used CSS, Less, SASS/SCSS, Stylus, PostCSS etc. the reason i have settled…

> can tailwind be used poorly? absolutely. but that's true of any tool Can tailwind be a useful CSS framework? Absolutely, but that can be said of any of them. Which is precisely why it makes sense to point out it's unique flaws, so that people can make an informed decision as to what works best for them. If you have some unique feature to tailwind that you think makes it better than the rest, you should share that.…

> Tailwind instead pushes the dev into a CSS-first approach. You think about the Tailwind classes you want, and then throw yet-another-div into the DOM just to have an element to hang your classes on.

But this isn't a unique flaw for Tailwind. I've been coding with CSS since the late '90s and seen plenty of people throw yet-another-div onto the DOM just to have an element to hang their classes on. Done so myself plenty of times, too.

People have been complaining about div soup for years and years before Tailwind ever came along.

Plus I'm coding with Tailwind now, and almost never think about my classes before my HTML. Nothing about Tailwind in particular encourages you to do so. So I'm quite confused how this is a unique Tailwind flaw.

Re: Moving away from Tailwind, and learning to structure my CSS

#235

> I got curious about what writing more semantic HTML would feel like. I've been teaching semantic HTML / accessible markup for a long time, and have worked extensively on sites and apps designed for screen readers. The biggest problem with Tailwind is that it inverts the order that you should be thinking about HTML and CSS. HTML is marking up the meaning of the document. You should start there. Then style with CSS.…

I agree. I don't really like Tailwind, nor similar CSS frameworks. The whole idea was to separate styling from HTML, and Tailwind is putting it back into HTML through the backdoor. It's just a way to do styling from your HTML without having to touch the CSS, by inserting styling info in your HTML. That's exactly what we were trying to move away from.

Re: Moving away from Tailwind, and learning to structure my CSS

#236

Earlier quoted context omitted.

> nothing about tailwind forces you to build inaccessible or "div soup" apps Totally agree. I feel like this was more a by product of React. Not that React forced this either, but it felt like the rise in both went hand in hand for some reason. While I think it's true that none of the current top FE technologies force the div soup, they don't discourage it either. It would be nice if what ever FE technologies catch o…

Nothing about programming forces anyone to do anything. That's never been a valid argument to dismiss criticism. It wasn't with Dreamweaver, any it wasn't with visual basic, and it isn't with Tailwind. Patterns matter. Best practices matter. Path of least resistance matters. Those are all choices you make when you develop a CSS framework. Some of those choices are good and some are bad. If none of those things matter…

> Nothing about programming forces anyone to do anything

I see you've never written any Go

Re: Moving away from Tailwind, and learning to structure my CSS

#237
post #235

> I got curious about what writing more semantic HTML would feel like. I've been teaching semantic HTML / accessible markup for a long time, and have worked extensively on sites and apps designed for screen readers. The biggest problem with Tailwind is that it inverts the order that you should be thinking about HTML and CSS. HTML is marking up the meaning of the document. You should start there. Then style with CSS.…

I agree. I don't really like Tailwind, nor similar CSS frameworks. The whole idea was to separate styling from HTML, and Tailwind is putting it back into HTML through the backdoor. It's just a way to do styling from your HTML without having to touch the CSS, by inserting styling info in your HTML. That's exactly what we were trying to move away from.

I think this assertion is where most of the conflict comes from.

There is a fair amount of people that disagree with the premise that it should be separated in that way (Including me).

I personally like this essay by the author of htmx on the topic

https://htmx.org/essays/locality-of-behaviour/

Also just better composition imo.

Practically I think this means components of scoped css, html, js.

People never seem to have the same complaint about mixing or separating app code and sql in the same way?

Re: Moving away from Tailwind, and learning to structure my CSS

#238

Earlier quoted context omitted.

> Personally, I'd rather deal with a localized class soup than trying to make sense of overlapping, often contradictory, cascades of styles across multiple files. That seems like a false dichotomy. I'm a huge fan of locality (both in software engineering and in physis) but you can also "localize" your styles by scoping them appropriately. (Modern frontend frameworks typically do that automatically for you at the comp…

Yes, you could build your own framework to localize your styles. Or you could just use Tailwind.

You're misunderstanding me. I never said you should build a framework. I said frontend frameworks already provide style locality out of the box, so there is no need to introduce an additional framework (Tailwind) for that.

Re: Moving away from Tailwind, and learning to structure my CSS

#239
post #54

Earlier quoted context omitted.

you're unfairly conflating things and putting the blame for a lack of care or understanding on tailwind vs on the dev themselves. nothing about tailwind forces you to build inaccessible or "div soup" apps can tailwind be used poorly? absolutely. but that's true of any tool i've been writing CSS for ~20 years and am quite capable with it, having used CSS, Less, SASS/SCSS, Stylus, PostCSS etc. the reason i have settled…

> can tailwind be used poorly? absolutely. but that's true of any tool Can tailwind be a useful CSS framework? Absolutely, but that can be said of any of them. Which is precisely why it makes sense to point out it's unique flaws, so that people can make an informed decision as to what works best for them. If you have some unique feature to tailwind that you think makes it better than the rest, you should share that.…

Even the root comment mentions the exact same failure mode:

> If you need extra elements for styling at that point, you might use a div or span (but you should ask yourself if there's something better first).

This is IMO not worse than vanilla CSS, and it's simply the only way to have customizable layouting in HTML.

Re: Moving away from Tailwind, and learning to structure my CSS

#240

Earlier quoted context omitted.

The more experienced Tailwind proponents probably have better things to do than get dragged into yet another online flamewar :) I've done tons of CSS since the 90s before looking into Tailwind. After it clicked, I've mostly tried to avoid raw CSS. In a sense, you exchange one mess for another. Personally, I'd rather deal with a localized class soup than trying to make sense of overlapping, often contradictory, cascad…

> Personally, I'd rather deal with a localized class soup than trying to make sense of overlapping, often contradictory, cascades of styles across multiple files. That seems like a false dichotomy. I'm a huge fan of locality (both in software engineering and in physis) but you can also "localize" your styles by scoping them appropriately. (Modern frontend frameworks typically do that automatically for you at the comp…

> both in software engineering and in physis

I meant physics of course!

Post reply on HN