CommunityNews

CommunityNews

Why I don't like Tailwind CSS

You’re at a restaurant, and there’s an odd item on the menu that you’ve never heard of before, but it piques your interest. It sounds like it might be worth a try, though you’re not sure.

When the waiter approaches your table, you inquire about the dish; he notes that while most people are initially repulsed by its appearance, they should still give it a try because the chef swears that it’s supremely delicious. So, trusting his judgment, you order the dish and wait.

When your meal arrives, it looks just as unpleasant as it did in the menu. But you’re not one to judge—you’re willing to try new things. You carve into a slice of it and take a reluctant bite. And… well, it’s really not that great.

In a nutshell, this was my experience with Tailwind CSS. It’s not the worst thing to happen to CSS, but it’s certainly not the panacea that its supporters claim it is—and, in fact, it has a lot of problems…

This thread was posted by one of our members via one of our news source trackers.

Most Liked

alanq

alanq

Interesting article, some well made points but it only confirms to me that Tailwind probably is the right approach for me.

Every single approach has a trade off, and that can be presented as a criticism. But that doesn’t mean it might still not be the best approach available. Are the alternatives, whose trade offs aren’t touched on in this article, really better for a particular use case?

Maybe it’s just me, but my HTML is a bit ugly and not very readable anyway. It doesn’t feel like much of a sacrifice to have more, and initially obscure looking, html classes in it.

An example of a criticism from the article that is actually a plus for me:

you’re lying to yourself if you think this is any better than writing CSS directly, or any more maintainable than directly applying inline styles. Because instead of repeating styles in your CSS, you’re now repeating them in your HTML, through class names. In fact, you’re likely repeating yourself three, four, possibly many more times now because you can’t chain selectors.

In my workflow, NOT having to open up a CSS file at all, being able to specify the presentation directly inline inside the view template, is a huge win and avoids disrupting my train of thought. It is massively better than writing CSS directly, for me.
And I can easily use helper methods to DRY up commonly repeated sets of classes (with Ruby on Rails view helpers in my case).

Opinionated is great, but this article reads quite biased to be honest. Just a warning to anyone who reads the snippet without reading the full article and considering for themselves whether alternatives really would be better.

dimitarvp

dimitarvp

I had almost the same thoughts reading it. I was like: “wait… putting style class names inside HTML is a bad thing?” WTF? I always did it like this – I am not a frontender and I only occasionally need to write HTML+CSS (mostly for hobby projects) and to me that’s actually a good thing. As you said, less interruptions.

I’d be open to something like LESS / SASS / SCSS as well though. But IMO for most small projects any of those would be a total overkill.

malloryerik

malloryerik

I’m personally liking Tailwind. My own pain points with it (minor pain, more like aches or itches…) are around stuff like combining Tailwind’s versions of CSS Grid and Flexbox which I already don’t use frequently enough to remember without constantly checking the docs, but which require enough understanding that now I’m checking two sets of docs instead of one.

Ah, this looks nice:

Where Next?

Popular Frontend topics Top

AstonJ
By @kobaltz Here’s a related thread about StimulusReflex - an exciting new way to build modern, reactive, real-time apps with Rails.
New
First poster: bot
Stork Turns One: Building a search tool for static sites with Rust and WebAssembly • jameslittle.me. Stork, my web search side project, ...
New
First poster: AstonJ
Welcome to the 5th edition of the JavaScript Rising Stars, our annual round-up of the JavaScript landscape! The concept is the same as b...
/js
New
First poster: bot
In JavaScript programs, asynchrony arises in situations such as web-based user-interfaces, communicating with servers through HTTP reques...
/js
New
First poster: dimitarvp
The future of web-based software architectures is already taking form, and this time it’s server-rendered (again). Papa’s got a brand new...
New
First poster: bot
ReScript, née BuckleScript, is a state-of-the-art compiler that used to target OCaml (and Reason), but is fast moving away from its paren...
New
First poster: bot
VanillaJS v. jQuery v. hyperscript Below are comparisons of how to implement various common UI patterns in vanilla javascript, jQuery an...
New
First poster: AstonJ
;; This is an animated & interactive guide to ;; building a game in ClojureScript, because ;; I find the design patterns very intere...
New
First poster: bot
In this article, we will look at the fascinating evolution of graphics in browsers from the prehistoric days of the early browsers. We wi...
/js
New
First poster: bot
CSS Fingerprinting is a technique of tracking and gathering information on site visitors. This method exploits the nature of CSS to track...
New

Other popular topics Top

Rainer
My first contact with Erlang was about 2 years ago when I used RabbitMQ, which is written in Erlang, for my job. This made me curious and...
New
PragmaticBookshelf
Rust is an exciting new programming language combining the power of C with memory safety, fearless concurrency, and productivity boosters...
New
AstonJ
Just done a fresh install of macOS Big Sur and on installing Erlang I am getting: asdf install erlang 23.1.2 Configure failed. checking ...
New
AstonJ
This looks like a stunning keycap set :orange_heart: A LEGENDARY KEYBOARD LIVES ON When you bought an Apple Macintosh computer in the e...
New
AstonJ
If you are experiencing Rails console using 100% CPU on your dev machine, then updating your development and test gems might fix the issu...
New
foxtrottwist
A few weeks ago I started using Warp a terminal written in rust. Though in it’s current state of development there are a few caveats (tab...
New
New
First poster: AstonJ
Jan | Rethink the Computer. Jan turns your computer into an AI machine by running LLMs locally on your computer. It’s a privacy-focus, l...
New
AstonJ
If you’re getting errors like this: psql: error: connection to server on socket “/tmp/.s.PGSQL.5432” failed: No such file or directory ...
New
PragmaticBookshelf
Get the comprehensive, insider information you need for Rails 8 with the new edition of this award-winning classic. Sam Ruby @rubys ...
New