I expected the section titled 'CSS is a solved problem' to talk about modern CSS features like CSS Grid and variables. Instead, the article declares the popular CSS framework Tailwind to be the 'solved' solution.
CSS will never be nice (tolerable at best), but modern CSS actually makes it easier to create layouts today rather than having to rely on horrible CSS layout hacks from the past.
In short, CSS is not 'solved', but modern CSS is more powerful and capable than it has ever been. If you want to take advantage of it, you simply need to put aside some time to learn it.
I know, many folks love css, but I find it a big mental discontinuity from html and js. It's solving a different problem
This is actually the misconception that leads to confusion with (and ultimately, poorly written) CSS.
It comes from a misunderstanding of what creating a web page actually is.
As Alan Kay once remarked, “A change of perspective is worth 80 IQ points.”
This is no less true with CSS.
Most developers view CSS an annoying 'styling' language, that's 'not really a programming language'. Which separates it in your mind from the engineering frame of view that tends to excite you as a developer.
This makes CSS tedious to use.
In truth, HTML and CSS are parts of a holistic language of layout construction. They work in unison, not as individual components. Very much an engineering toolset. Just that the problems to be solved are more visual in nature than you're probably used to.
Instead of seeing CSS as an annoying way to 'style' pages, see it instead as a visual programming language for constructing visual guides (UI's) for your user.
You don't 'style' pages, you 'construct' and 'architect' them. It sounds weird to use these words, but they have a massive effect in changing your perception of what you're doing. And that has a massive effect on your impression and willingness to learn how to do it well.
I think that understanding this is one of the key differentiators between developers who are good with CSS and those that struggle.
Tools like TailwindCSS (that lead to a massive increase in both productivity with CSS as well layout maintanability) are based on this fundamental premise.
Sidenote: I'm also working on a book that aims to help you gain mastery over CSS, showing you how to truly understand it, by learning how to debug its most common issues as well as re-framing how you see it in the way I've described above. You can check that out here: https://gumroad.com/l/Debbg/z823cp8.
Furthermore, when you are talking about something that solves the scope of problems which CSS solves, there is no way you can just sit down and design a better system
CSS has proved an awful system for layout, design and practically every domain it attempts to address over the last couple of decades. Having worked with both for a long time, here's the fundamental difference between HTML and CSS, as I think it's a useful comparison and highlights when worse is truly better, and when it is just worse:
HTML was limited and simple by design, and has gradually improved (the original worse is better ethos)
CSS was broken by design, and hasn't much improved (maybe in a few years with flexbox and grids, maybe).
I don't find it at all surprising that someone thinks CSS could and should be replaced, and I'm skeptical that if the best minds of our generation took another look at it, they couldn't find some far better ways to lay out content than an inconsistent and confusing box model with concepts like floats tacked on to it and lots of module proposals to try to glom on additional layout modes. I can't think of many problems CSS solves well, apart from separation of style/layout and content, even there at present we have div soup for grids instead of table soup - hardly a huge improvement on what went before. Some of the problems it attempts to solve are not even real-world problems and are of its own devise (for example the Cascading Style priorities in its name - what a bizarre focus for a layout language).
Perhaps the answer is a turing-complete layout language (personally I doubt it), or perhaps it's another more informed declarative one, but I'm quite sure we can improve on it, and the comparison to HTML is apposite, because that has stood the test of time rather well compared to its companion technologies.
It's a little tiresome when a young idealist comes into a 25-year-old field
We don't live in the best of all possible worlds, and to make it better, we sometimes have to take a step back from a local maximum and look at the bigger picture; that involves listening to 25-year-olds coming up with something better - most of the time they won't, but sometimes they will. If you find yourself not even listening, and more concerned with sunk costs, work already done, and expertise already gained, that's not healthy and not a convincing riposte.
This isn't an article about CSS features, nor is the linked site. This is about how designers think about their design and how that doesn't translate well into CSS. Both articles are trying to bridge the gap between design and implementation based on the reality of web content and browsing.
Also from the article:
> Paradoxically, where CSS Grid shines is not only in building layouts that adhere to a strict design grid, but in baking flexibility into our components.
The only thing that is true is people don't learn CSS but Tailwind syntax. But even with that, making a house of card of CSS isn't change the inherited problems of CSS.
The entire article itself presents incredibly poor reasoning or no reasoning at all for its points.
It's really hard to appreciate it now because CSS (along with JS+HTML) has been extended and upgraded gradually over the years, but CSS is incredibly good for styling and formatting DOCUMENTS - which have a very specific definition, especially back in the 90's when it was first conceived. This is what is was originally designed for.
In that sense the complaints about CSS are perfectly reasonable: why are we using a document styling language for building arbitrarily sophisticated web applications when it was clearly not originally designed for that? You could say the same with HTML and JS really.
> Quit acting like CSS is some giant-ass mistake that needs fixing. A group of people who were collectively smarter than us wrote those specs. They didn’t make mistakes. Assume you are making the mistake, not them.
So what year again was the CSS standard was first published? Checks google quickly -- oh it was back in...1996. HTML was...1991. And JavaScript in...1995.
Yes, it's well known that people in the 1990's were much smarter than people in the 2020's! It's not like there's been decades of progress since then! CSS is utterly fit for purose and bereft of any flaw or defect! Absolutely nothing new needs to be invented or discovered about front-end web development in 2024! There's no point in trying to improve things!
OK, it's hilarious the author rails against things like SASS, and CSS is now being updated to incorporate many of the same features that SASS introduced:
- Not to mention things like CSS variables, calc() etc.
Usually people whine about the status quo or things staying the same for too long and in response, try to improve things. This article almost seems like a big whinge about how things should stop changing and regress or go back in time? That's not happening. If people had the author's sensibilities or attitude back in the 2000's we'd never move past `float: left` for positioning or tables for multi-columnar layouts. Utterly bizarre.
I'm not going to defend the article, but I really bristle at this idea that if you just _get_ CSS it isn't problematic anymore. CSS tries to solve a hard problem and it's certainly preferably to inline-everything, but its design (global, cascading, with many types of behavior—positioning, z-stacking, etc—depending on the styling of parent elements in interesting ways) is actively hostile to many kinds of modularity, and that's a real issue even for people who "get" CSS.
Fully agree. Seems like the author pointed out one thing - that there are increasing numbers of units usable in CSS, doesn't really talk about why that's bad, and then wraps it up.
I think there's a general anxiety some devs have about how much CSS has been developed in the past few years, and I think that partially comes from not being able to keep track of all the changes anymore. Like it wasn't uncommon a few years ago to have a few CSS experts on your team that felt comfortable with every single thing in the CSS spec, but now that's becoming a little less common as the spec and implementation in browsers evolve and grow. But I think that doesn't mean there's a "tragedy" of CSS. I think it means CSS is becoming more complex, but to me it's generally been in the right direction.
Saying "CSS is a better solution than Tables for reasons [X,Y,Z] but it is at the cost of a higher learning curve," is much different than saying "CSS is a better solution than Tables for reasons [X,Y,Z] but you're too incompetent to understand."
CSS layout problems are not why so many people use Flash. Flash has popularity because for pure designers working in a GUI on a canvas where you can pixel place every item with drag-and-drop is natural and taught in school.
As for examples, the article calls out the canonical CSS layout example site made specifically for this purpose years ago: http://csszengarden.com/
The thing that gives me incomfort is the knowledge that we have a turing-complete language to manage display preferences.
It’s not accurate to imply what CSS does is only “managing display preferences”.
CSS is the presentation (color, layout, typography, animation, speech) and state management layer for HTML and SVG, among other markup languages.
I much rather have agreed upon specifications instead of having to invent hacks and work arounds for things that should be standard in 2022.
It took 20+ years to get layout based on columns and rows (CSS Grid); before that, layout comprised of hacks (floats, absolute positioning) and features being misused, like tables.
Container queries, CSS Nesting and the parent selector—-:has()—-results in less and easier to understand code with fewer hacks. It also means doing more without reaching for JavaScript.
CSS is in a good place finally and I for one hope it continues.
While there is nothing inherently wrong with the language, there have traditionally been vast inconsistencies across implementations such that the whole "Peter fighting blinds" meme becomes quite relevant. Further, it's worth noting that even the amazing demo shown on the page wasn't written in CSS -- it's written is SASS, a separate language that makes up for what many people see as CSS's shortcomings. Even further, the page highlights upcoming features, such as grid layout, which WOULD be awesome IF and WHEN they are implemented in all browsers, but as we learned with CSS 3.0/3.1, implementing certain features may not go according to plan.
I agree, no one should be belittled for using CSS as their "weapon of choice", and in fact, in many cases, it is the best choice, but let's acknowledge that there are real reasons to criticize it other than the fact that some think of it as "weird" language.
That's my point though: Being way better and logical than what came before is NOT the same as being a good solution. The Article here is talking about how the UI experience is lagging behind the coding improvements. The poster a few posts above pointed out that CSS has indeed made progress. And my argument is that both statements can be true: CSS is much improved, but still sucks.
I agree. The problem that people are having is that CSS has completely changed within the past 5 years, especially positioning, as all of the modules have been implemented. Things that once involved elaborate and fragile rituals to perform are now trivial to write. If you knew CSS 10 years ago and never went back to survey it since, you don't really know CSS now.
I finally stopped claiming I knew CSS until I took a few months to work through a top to bottom overview. None of the skills I had 10 years ago apply to modern CSS; I had to give up every habit. This is a good time to do a review, because CSS development seems to have slowed down considerably, and browsers are all pretty good.
However, CSS has become very big, and web development teams should really start respecting it as a specialty in itself, and making sure they have at least one person who knows it all. Even if they use tailwind.
I've been building websites since they were invented and I agree completely. CSS itself has evolved to the point where you are worse off if you use a pre-compiler or alternative.
In one sense, it was always worse to use Tailwind because if you don't learn "real" CSS you won't be able to fix anything that's broken -- and with CSS, there's always a lot that's broken.
The web has never lived up to that ideal. Sometimes you need to add a wrapper div with no semantics to make your layout work. Sometimes you need some Javascript to do a special layout CSS doesn't support or work around some other limitation. I've never seen a project that actually had meaningful "separation of concerns" based on technology, whereas almost every componentized project has at least decent separation of concerns along the component axis -- where you can drop a component into a design without thinking about it's internals at all.
We had desktop UI's in far simpler forms years before. Yeah, sure, there are new requirements, but those requirements didn't actually need the complexity of modern CSS.
modern CSS came about because people like to be fancy. You value the wrong thing, you get the wrong thing.
Here's the thing: Most of us who are perplexed are actually perplexed because is was something you used to be able to do trivially and then a new standard came along and made it unreasonably hard for about 15 years. An eternity in software development. Entire generations of paradigms have come and gone in the time it's taken for CSS to fill this gap.
That will never stop being perplexing, no matter how many new models they throw on top to try to fix it.
I will never like CSS and cannot share any fond memories of it's development.
Modern CSS is bearable with features like Flexbox and Grid, but CSS will never be able to hide how inelegant, clunky and sprawling it is. You could write an entire book on CSS 'gotchas' - from specificity to box-sizing to inheritance. The list of topics is endless.
There are also dozens of different ways of writing CSS (by design) which is why you never see two or more people write it in the same way.
Why did a "style sheet" language incorporate animation into its already bloated feature set? (Not convinced by the argument that animation = appearance and thus fits into the scope of CSS.)
It's a bit ironic that modern CSS features let you finally drop horrible CSS hacks from the past like floats. And yet, developers are not taking advantage of modern CSS features like Grid (which greatly simplifies layout). CSS frameworks often don't take advantage of these modern features either.
In fact, modern CSS makes it easier to write plain CSS without the use of a CSS framework. But is there anyone left who isn't using a framework?
CSS will never be nice (tolerable at best), but modern CSS actually makes it easier to create layouts today rather than having to rely on horrible CSS layout hacks from the past.
In short, CSS is not 'solved', but modern CSS is more powerful and capable than it has ever been. If you want to take advantage of it, you simply need to put aside some time to learn it.
reply