Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Why Tailwind CSS Won

matt-rickard.com

Post reply on HN
Print view View original

301–310 of 559 posts

Re: Why Tailwind CSS Won

#301

Post by keyle »

Naomarik wrote: post #222
keyle wrote: post #140

Gray beard's 5c: Tailwind is a farce and a catastrophe. It's as modern as the style parameter is, and it's as reusable as a moving a dirt pile from one corner to the next. You're not learning anything valuable by learning Tailwind. Learn CSS, that will stick with you for the next 20 years. It amuses me when a library is implemented 'with tailwind', which means it's totally useless to the people _not using tailwind_,…

Five years? How about now. I saw a video a few months back featuring a VScode plugin to hide tailwind styles. If you have to use a plugin to manage your nuclear waste code by hiding most of it something is wrong.

My god, it's true!

https://marketplace.visualstudio.com/items?itemName=stivo.ta...

Re: Why Tailwind CSS Won

#302

Post by nucleardog »

ethanbond wrote: post #286
nucleardog wrote: post #278

Earlier quoted context omitted.

Agreed. I've been using CSS for over two decades now. The composibility, reusability, and maintainability benefits of CSS have just never materialized outside of some very tight scopes such as toy projects or single developer projects as far as I've seen. And we pay heavy costs having half of the context of whatever we're working on living in an entirely separate file (any generally multiple discrete areas within tha…

This resonates quite well with my experience. If you understand CSS well and you’re using TW, you will ~never have to go chase down some crazy style cascade via the inspector. No amount of understanding CSS can save you from that in a complex CSS/SCSS codebase, because it’s how CSS is meant to be used.

Yeah it wasn't until I was reflecting and writing that comment that I realized _I don't remember the last time I had to look at CSS in the dev tools_ and how much better my life is for it.

Maybe I just suck at CSS. I mean, I've been using it for decades, but maybe I'm too stupid to actually understand it. And maybe it's the same story for everyone else I've ever worked with and that's why my experience with it has never lived up to the ideals.

... but if that's the case then at this stage of my career, with vast and varied accomplishments behind me, I think that says more about CSS than about me.

Re: Why Tailwind CSS Won

#303

Post by cantSpellSober »

conradfr wrote: post #114
xigoi wrote: post #50

Earlier quoted context omitted.

> class="my-4 mb-sm-5 mb-lg-6" I've seen Perl code that was more readable than this.

If you know the convention it's quite easy. I don't know Tailwind but with Bootstrap it would be m = margin, y = y axis, b = bottom, sm/lg = screen size, 4/5/6 = size

I already know CSS, I don't want to learn another convention. I've learned Bootstrap, Tailwind, Foundation, Tachyons, Chakra, Bourbon...at each moment in time they were to be the "last" new CSS library we'd ever use.

Re: Why Tailwind CSS Won

#304

Post by yoav »

blitz_skull wrote: post #267
keyle wrote: post #140

Gray beard's 5c: Tailwind is a farce and a catastrophe. It's as modern as the style parameter is, and it's as reusable as a moving a dirt pile from one corner to the next. You're not learning anything valuable by learning Tailwind. Learn CSS, that will stick with you for the next 20 years. It amuses me when a library is implemented 'with tailwind', which means it's totally useless to the people _not using tailwind_,…

Cool hot-take but it’s not true. You’re literally learning CSS when you learn tailwind. And no one (good) picks up a tool solely because it’s shiny, they pick it up because they find it has utility, which evidently LOTS of people do. And if you don’t think it’s reusable then you at least need to bring an argument for why that’s so because the docs, personal anecdote, and the opinion of LOTS of people is completely op…

Senior Staff grey beard: Counterpoint: The C in CSS stands for Cascading.

So you’re not learning CSS. You’re learning Tailwind specific classnames that expand to non-cascading style rules.

Re: Why Tailwind CSS Won

#305

Post by yurishimo »

progx wrote: post #189
sod wrote: post #45

If css had a strong opinion and better syntax for responsiveness by screen width, css frameworks were way less popular. Tailwind, bootstrap and co. aren't used to avoid writing css. It's used because writing `class="my-4 mb-sm-5 mb-lg-6"` is so much faster and easier then doing this with a bunch of media queries and a class name, that has to be unique, because css is a global scope nightmare. I mean, just look at it.…

And you write this crap `class="my-4 mb-sm-5 mb-lg-6"`hundreds of times in complex applications or `class="foo"`?

How many components in your application actually need the exact same layout tweaks in every use instance?

There are some properties of CSS that are more static across screen sizes. Colors, borders, backgrounds, font-size (debatable!), animations, and maybe even some high level layouts (12 column grid, etc).

The rest of CSS is minute positioning via padding, margins, and widths. Often you need to customize those details to use slightly different values dependent on context within the application itself. This is where utility classes shine.

Re: Why Tailwind CSS Won

#306

Post by petabytes »

keyle wrote: post #140

Gray beard's 5c: Tailwind is a farce and a catastrophe. It's as modern as the style parameter is, and it's as reusable as a moving a dirt pile from one corner to the next. You're not learning anything valuable by learning Tailwind. Learn CSS, that will stick with you for the next 20 years. It amuses me when a library is implemented 'with tailwind', which means it's totally useless to the people _not using tailwind_,…

After a few years, writing CSS by hand gets really old. There's always 5 different ways to do something, and I don't know which one is the most performant or portable.

Re: Why Tailwind CSS Won

#307

Post by methodical »

keyle wrote: post #140

Gray beard's 5c: Tailwind is a farce and a catastrophe. It's as modern as the style parameter is, and it's as reusable as a moving a dirt pile from one corner to the next. You're not learning anything valuable by learning Tailwind. Learn CSS, that will stick with you for the next 20 years. It amuses me when a library is implemented 'with tailwind', which means it's totally useless to the people _not using tailwind_,…

Bootstrap and its newer counterpart Tailwind have been around collectively longer than a decade, and I can't see any reason why their popularity would die down. It's easier to learn, quicker to write, and reduces a lot of issues that arise from poor CSS. I can see why some people aren't a fan, but those people seem (from my perspective) to be either luddites or people who misunderstand Tailwind. When you have people across the entire spectrum of experience who find writing styles faster with Tailwind, I can't understand how people find themselves on the opposite side of the argument without having some underlying bias or no practical experience utilizing Tailwind.

Re: Why Tailwind CSS Won

#308

Post by sourcecodeplz »

emmacharp wrote: post #233

Food for thought: https://csswizardry.com/2018/11/css-and-network-performance/ Progressive rendering of CSS is a great boost in performance. Tailwind can't benefit from this technique I think and as such, imposes an added cost on our users. Correct me if I'm wrong!

Interesting argument. I have actually seen many news websites with huge inlined CSS in their tag.

Re: Why Tailwind CSS Won

#309

Post by punyearthling »

CSS is moving so fast these days, can Tailwind keep up?

I see loads of comments in here using things like `.mb-sm-3` (I presume it's `margin-bottom: 3` for small screens?) as an example for how readable the classes are, but with CSS introducing logical properties I wonder if Tailwind's syntax needs to update to accommodate those changes? Using logical properties, this same example would render to `margin-block-end: 3` and already you're moving away from the easy-to-remember shorthand Tailwind created. If Tailwind's syntax needs to update, isn't that a pain in the ass to maintain?

This is just one example, but CSS is introducing loads of new stuff every few months it seems and I would hate to be limited by the constraints of a CSS library when browsers are capable of achieving so much these days. I enjoy learning CSS, not Tailwind.

Re: Why Tailwind CSS Won

#310

Post by afiori »

keyle wrote: post #140

Gray beard's 5c: Tailwind is a farce and a catastrophe. It's as modern as the style parameter is, and it's as reusable as a moving a dirt pile from one corner to the next. You're not learning anything valuable by learning Tailwind. Learn CSS, that will stick with you for the next 20 years. It amuses me when a library is implemented 'with tailwind', which means it's totally useless to the people _not using tailwind_,…

Tailwind is made for a component world where reusability is at the template/component level.

This also covers both scoping issue with css: the usual issues with the single global namespace for classes and the unlimited depth of the descendant selector.

That is even with scoped classes if your app has component nesting as then a selector like .A_box::hover .A_btn will select the class A_btn both in and .

Tailwind solution is to manually or programmatically apply the relevant style in your template.

The whole idea being that the unit of reuse is not the class name but the templating component.

Post reply on HN