You've got the horse before the cart, and completely misunderstand Semantic CSS.

The styling should simply serve to improve the content. The content should generally stand on its own without any styling.

In semantic CSS the goal is to write your HTML with as little regard to presentation as possible. Your HTML is simply structuring human readable data. At this step you give it no thought of appearance.

Styling that structured data comes second. You write the CSS to make the structured data look nice, and ideally do not touch the HTML in the process, at all. The styling is but an affectation.

This fell out of favor because people cared more about looking flashy than quality content, they didn't want to put any thought into developing the actual page and wanted to start with the design. It's a symptom of the overall disease of the modern web.

This is more achievable with modern CSS than ever before and I pray for it to make a comeback.

Note for carriage owners: “Horse before the cart” is actually the correct order.

Looking flashy is a _significant_ signal that users rely on to determine if the content is quality or not. It's a sad fact that, if your site does not ape the style consensus it'll look outdated or worse like a scam. Its the same reason used car salesmen wear suits.

We tried all that stuff in the early 2010s. I was there. It didn't work.

People ditched element-based CSS for good reasons: it forces you to maintain increasingly complex stylesheets, because you end up having to come up with increasingly arcane rules describing how the design links back to content.

But some design isn't about content. Sometimes you need a button that's centered because it just looks better. There's no semantics or document structure you can point to, to justify that.

(So then you end up with post-hoc mental gymnastics like, "hmm, well, it's the second last button on the page in this one instance, so let's write an :n-selector that only targets the penultimate <button>...")

So having classes lets you keep the look and the meaning orthogonal. Which is especially helpful when you don't have total control over the markup (e.g. most content management systems)

I don't do a ton of web development but I occasionally need a little webview or form, and this is exactly how I write them.

That's how I was taught, you know, progressive enhancement. I didn't even know there was any other way lol