I’ve ran into almost all of this, and css is still the worst thing in the list. It’s literally the highest wtf/gfy per minute among all. Barely debuggable, inconsistent, comefrom by design, inarticulate crap.

Especially since all the things that one would expect should be easy were just really difficult to do for a long time, things like vertically centering, layouts before grid/flex, changing a style in one place and not accidentally breaking some other part of html. There was a lot of tribal knowledge about browser quirks, how to clear floating divs for example, selector precedence, how margins collapse, etc, it's all just non-essential complexity that bites you in the ass when you have the least time to deal with it.

Exactly. Css is magic, in a sense that you can’t make any sense of it. Just look at this: https://stackoverflow.com/a/19719427 , you can “tune” collapsing margins by adjusting overflow, float or position. Yeah! Imagine adjusting your seat by pressing brakes or turning radio off.

Perhaps the only difference when using hidden is the unintended consequence of hiding content if the parent has a fixed height

This is css community fundamentals. It works “perfectly”, but make sure your height is not specified. Oh, and don’t change the container type. And with time it all depends more and more on other hacks, until your layout turns into a knot of hacks and cross-sectional assumptions smeared all across the “codebase”.

And then you ought to make fully isolated non-leaky components with it. I mean, you can’t, but here’s a hack to make them fit together. I mean, in this particular case, wow thank god the container is already position absolute.

> Just look at this: https://stackoverflow.com/a/19719427 , you can “tune” collapsing margins by adjusting overflow, float or position. Yeah! Imagine adjusting your seat by pressing brakes or turning radio off.

The seeming complexity here is because people refuse to learn the box model, so they learn all sorts of incantations and guess at what they need to do: https://developer.mozilla.org/en-US/docs/Learn_web_developme...

C is magic in that I can’t make any sense of it when I don’t bother to learn it.

Thanks for not posting the link to the “boxing model”. It gets posted every time, as if web/css invented boxing and padding and spacing and borders, and everyone else was a clueless noob. Which clearly shows inability to even comprehend both the problem and how deep css guys are into the bizarre ways of thinking about layouts that css suggests through its paradoxical under- and at the same time over-engineering. Where everything is a combination of crutches that can’t stand straight on their own.

And yes, C is a pile of crap too. I programmed in it for 15 years.

Agreed. No static typing. Everything is global. Super easy to accidentally break a thing on some other page that you aren’t aware of. It’s just a brittle stack. Tailwind is by far my favorite bandaid for dealing with all of that. Perfect? No. But it’s the best thing I’ve used in almost 25 years doing this professionally.

What are you talking about? CSS is statically typed. It has a fairly strict, well defined schema.

Idk what gp meant, but css lacks what could be called “selector accounting”. You never know which parts affect what and whether they affect anything at all. Because instead of importing/use-ing styles or classes, it imposes styles over some unpredictable set of nodes through a selector. On top of that, every name is global.

This contrasts to every modern language, regardless of declarative or not, where to get the effect you import it explicitly into a chunk/block/component/etc.

If css was C, it could add “unsigned” to every first int variable in a function that goes after a typedef. Which was part of “aspect oriented programming”, which was deemed an absurdly bad practice, to put it simply.

Most of CSS is indeed statically typed (property have statically typed valid values). It's not true anymore when you introduce custom properties and IACVT though.

Custom properties can also be typed https://developer.mozilla.org/en-US/docs/Web/CSS/@property