4 ms·

My final conclusion about CSS is - program the damn machine. What I mean by this is STOP every single type of abstraction/library/programming layer for CSS - n

My final conclusion about CSS is - program the damn machine. What I mean by this is STOP every single type of abstraction/library/programming layer for CSS - nothing gets it right, everything causes a problem. The ONLY way to deal with CSS is program it directly in the way the docs say, never anything else. There's nothing wrong with using Bootstrap or whatever, and I definitely use JavaScript to program CSS. What I am saying is - no abstractions - no "better way" - no trying to turn CSS into something it isn't via whatever your new abstraction is that can be added to the N other abstractions that other people have made over the years. Program the damn machine.

yoz-y 6mo ago
For me nothing beats plain old classes and an external css file. For PWAs I just use lit css within the element, again with classes and plain css. If things cause problems, just figure out why and fix the classes.
herpdyderp 6mo ago
This is exactly how I feel. Learn how to write CSS! Like you would do with any language!
- exogen 6mo ago
  Been writing CSS since 1997. Your mistake is thinking that the authors of these frameworks (or their target audience) just don't know how to use CSS correctly. But it's far more likely that the authors know far, far more about the intricacies of CSS and how it works than most developers. These frameworks are almost always developed by people with deep experience in the trenches, who have realized that CSS scales fucking terribly... not because they are misinformed or did anything wrong. Namely: - Selectors are a global namespace. Imagine if every variable and function in your favorite programming languages were global and so had to be unique. No modules or namespaces. Developing a system to fix that would be pretty high on my list of priorities... coming up with a cool solution and then people telling me to "just learn the language" would be pretty fucking infuriating, don't you think? - Several fighting priority systems (did you know about newer ones like @layer?). And equivalent priority falls back to source order - OK, so how do you square that with dynamic loading? Some navigation paths through an app would inject some CSS first whereas others would inject other CSS first. Good luck!
  - pjaoko 6mo ago
    > Selectors are a global namespace. Imagine if every variable and function in your favorite programming languages were global and so had to be unique. A selector is not not a variable or a function. CSS has functions (e.g translate) and it has variables, which are both distinct concepts in the language from selectors. > No modules or namespaces. CSS is not supposed to be a turing complete general purpose programming language. Why would you need namespaces and modules to style up HTML tags?
    - exogen 6mo ago
      Because many web sites and apps aren't as simple as "my first homepage" and don't only consist of first-party code. Think component libraries. Reusable code. Content management systems. Third-party SDKs (chat widgets, support widgets, payment widgets like Stripe, etc.). One of my earliest webdev jobs was at a company whose product was a widget you could add to your site by adding our `<script>` tag. Thus, our CSS needed to coexist with the first-party site's, not to mention any other third-party widgets on there. In other words: the same exact reason you need modules in traditional languages.
      - bryanrasmussen 6mo ago
        It's true in a case where you are doing the described thing you will need to come up with your own module system and ways to not step on other people's stuff but it isn't actually difficult. Although I have noticed some stories recently were quite big companies evidently didn't put in the work to keep from messing up other people's stuff. Of course one drawback with that is you are also depending on developers and content managers at sites following your documentation on how to use your products, which is a different problem. on edit: obviously if you have been writing css since 1997 and one of your first webdev jobs was this kind of thing, things were much more difficult back then. I did the same sort of thing in 2014-2015, not particularly difficult to make work. I worked web dev since 1999, first job was dynamic generation of web sites and other media from single source data.
      - pjaoko 6mo ago
ericwood 6mo ago
CSS suffers from one of its original design tenants in that it's very easy to throw some shit at the wall and kind of get it working without fully understanding it. This is especially true for people who have dabbled in it from time to time in their career when absolutely needed. It's rare to see someone sit down and learn it from first principles. It doesn't take long and knowing the basic theory goes a long ways!
- antod 6mo ago
  I agree. I taught myself CSS1 by reading the spec (it was limited, small and simple). CSS2 was a lot bigger and way more complex but Eric Meyer's Salmon book helped a lot. One problem (20yrs ago at least) was that for a long time the specs weren't supported very well by common browsers. So everyone just prodded at hacks using trial and error instead of learning it. That approach never really went away even after support improved.
  - dotancohen 6mo ago
    > So everyone just prodded at hacks using trial and error instead of learning it. And that is exactly why all those frameworks started appearing. It wasn't developer laziness. It was developer sanity.
- jgalt212 6mo ago
  > CSS suffers from one of its original design tenants in that it's very easy to throw some shit at the wall and kind of get it working without fully understanding it And dev tools made this feedback loop much faster.
jjpones 6mo ago
I've loved tailwind for the colocation of the component HTML and its corresponding styling (never gave up on traditional CSS though!), but with scoped styles I might start leaning back to traditional CSS.
coffeefirst 6mo ago
Yes. It’s been twenty years of watching people pick an fussy framework because they don’t want to learn the tool, then struggle to get the results they want because the framework is flawed but they didn’t learn enough to understand how and when to fight it. And with grid, variables, animation, container queries, modern CSS is amazing. You just need to treat it with a little respect.
- wewewedxfgdf 6mo ago
  Lots of developers feel they need a library to program anything - got forbid that you should program that actual machine.
paradox460 6mo ago
I've been ranting about this for years, even wrote a blog post[1] a few years ago whinging about it. Nice to see others share the same sensibility 1: https://pdx.su/blog/2023-07-26-tailwind-and-the-death-of-craftsmanship/ https://pdx.su/blog/2023-07-26-tailwind-and-the-death-of-cra...
eviks 6mo ago
The only way to deal with a poorly designed system is NOT giving up, but engineering your way out of it
atoav 6mo ago
Also: web layouts are meant to look different on different screens. I had to program my own layouts from scratch for embedded devices and games before. And that occasionally made me wish for CSS. CSS is fine. Most people just never learned it.
bandrami 6mo ago
The worst part is that inevitably the frameworks end up being harder to learn than CSS due to feature accretion
- tenphi 6mo ago
  [dead]
easyThrowaway 6mo ago
I mean... sure, just tell me how to write a fully responsive landing page straight from a PSD file by the marketing dept in roughly less than an hour without using Bootstrap or, for goodness sake, Tailwind and I'm ready to drop any framework and write "bare metal" (Ah!) CSS. I'd also like if anyone could look at the specifications for CSS, ideally for Grid, especially the `grid-template-*` and `grid-auto-*` subset of rules, mixmaxing and gotchas and tell me what CSS exactly is right now, So I can avoid turning it into something that is not.

yoz-y 6mo ago

For me nothing beats plain old classes and an external css file. For PWAs I just use lit css within the element, again with classes and plain css. If things cause problems, just figure out why and fix the classes.

herpdyderp 6mo ago

This is exactly how I feel. Learn how to write CSS! Like you would do with any language!

exogen 6mo ago
Been writing CSS since 1997. Your mistake is thinking that the authors of these frameworks (or their target audience) just don't know how to use CSS correctly. But it's far more likely that the authors know far, far more about the intricacies of CSS and how it works than most developers. These frameworks are almost always developed by people with deep experience in the trenches, who have realized that CSS scales fucking terribly... not because they are misinformed or did anything wrong. Namely: - Selectors are a global namespace. Imagine if every variable and function in your favorite programming languages were global and so had to be unique. No modules or namespaces. Developing a system to fix that would be pretty high on my list of priorities... coming up with a cool solution and then people telling me to "just learn the language" would be pretty fucking infuriating, don't you think? - Several fighting priority systems (did you know about newer ones like @layer?). And equivalent priority falls back to source order - OK, so how do you square that with dynamic loading? Some navigation paths through an app would inject some CSS first whereas others would inject other CSS first. Good luck!
- pjaoko 6mo ago
  > Selectors are a global namespace. Imagine if every variable and function in your favorite programming languages were global and so had to be unique. A selector is not not a variable or a function. CSS has functions (e.g translate) and it has variables, which are both distinct concepts in the language from selectors. > No modules or namespaces. CSS is not supposed to be a turing complete general purpose programming language. Why would you need namespaces and modules to style up HTML tags?
  - exogen 6mo ago
    Because many web sites and apps aren't as simple as "my first homepage" and don't only consist of first-party code. Think component libraries. Reusable code. Content management systems. Third-party SDKs (chat widgets, support widgets, payment widgets like Stripe, etc.). One of my earliest webdev jobs was at a company whose product was a widget you could add to your site by adding our `<script>` tag. Thus, our CSS needed to coexist with the first-party site's, not to mention any other third-party widgets on there. In other words: the same exact reason you need modules in traditional languages.
    - bryanrasmussen 6mo ago
      It's true in a case where you are doing the described thing you will need to come up with your own module system and ways to not step on other people's stuff but it isn't actually difficult. Although I have noticed some stories recently were quite big companies evidently didn't put in the work to keep from messing up other people's stuff. Of course one drawback with that is you are also depending on developers and content managers at sites following your documentation on how to use your products, which is a different problem. on edit: obviously if you have been writing css since 1997 and one of your first webdev jobs was this kind of thing, things were much more difficult back then. I did the same sort of thing in 2014-2015, not particularly difficult to make work. I worked web dev since 1999, first job was dynamic generation of web sites and other media from single source data.
    - pjaoko 6mo ago

ericwood 6mo ago

CSS suffers from one of its original design tenants in that it's very easy to throw some shit at the wall and kind of get it working without fully understanding it. This is especially true for people who have dabbled in it from time to time in their career when absolutely needed. It's rare to see someone sit down and learn it from first principles. It doesn't take long and knowing the basic theory goes a long ways!

antod 6mo ago
I agree. I taught myself CSS1 by reading the spec (it was limited, small and simple). CSS2 was a lot bigger and way more complex but Eric Meyer's Salmon book helped a lot. One problem (20yrs ago at least) was that for a long time the specs weren't supported very well by common browsers. So everyone just prodded at hacks using trial and error instead of learning it. That approach never really went away even after support improved.
- dotancohen 6mo ago
  > So everyone just prodded at hacks using trial and error instead of learning it. And that is exactly why all those frameworks started appearing. It wasn't developer laziness. It was developer sanity.
jgalt212 6mo ago
> CSS suffers from one of its original design tenants in that it's very easy to throw some shit at the wall and kind of get it working without fully understanding it And dev tools made this feedback loop much faster.

jjpones 6mo ago

I've loved tailwind for the colocation of the component HTML and its corresponding styling (never gave up on traditional CSS though!), but with scoped styles I might start leaning back to traditional CSS.

coffeefirst 6mo ago

Yes. It’s been twenty years of watching people pick an fussy framework because they don’t want to learn the tool, then struggle to get the results they want because the framework is flawed but they didn’t learn enough to understand how and when to fight it. And with grid, variables, animation, container queries, modern CSS is amazing. You just need to treat it with a little respect.

wewewedxfgdf 6mo ago
Lots of developers feel they need a library to program anything - got forbid that you should program that actual machine.

paradox460 6mo ago

I've been ranting about this for years, even wrote a blog post[1] a few years ago whinging about it. Nice to see others share the same sensibility 1: https://pdx.su/blog/2023-07-26-tailwind-and-the-death-of-craftsmanship/ https://pdx.su/blog/2023-07-26-tailwind-and-the-death-of-cra...

eviks 6mo ago

The only way to deal with a poorly designed system is NOT giving up, but engineering your way out of it

atoav 6mo ago

Also: web layouts are meant to look different on different screens. I had to program my own layouts from scratch for embedded devices and games before. And that occasionally made me wish for CSS. CSS is fine. Most people just never learned it.

bandrami 6mo ago

The worst part is that inevitably the frameworks end up being harder to learn than CSS due to feature accretion

tenphi 6mo ago
[dead]

easyThrowaway 6mo ago

I mean... sure, just tell me how to write a fully responsive landing page straight from a PSD file by the marketing dept in roughly less than an hour without using Bootstrap or, for goodness sake, Tailwind and I'm ready to drop any framework and write "bare metal" (Ah!) CSS. I'd also like if anyone could look at the specifications for CSS, ideally for Grid, especially the `grid-template-*` and `grid-auto-*` subset of rules, mixmaxing and gotchas and tell me what CSS exactly is right now, So I can avoid turning it into something that is not.