CSS Is Easy (Until It’s Not)

If you’ve ever heard someone say “CSS is easy,” chances are they’ve never actually written anything more complicated than color: red;. And sure, at a glance, CSS looks easy. No semicolons to mess up like in JavaScript, no confusing loops or functions (at least, not until you touch Sass or CSS variables), and it’s just styling, right? How hard can it be?

Well, let me tell you—CSS is all sunshine and rainbows until it isn’t.

The False Sense of Security

Your first encounter with CSS is harmless. You change some text colours, adjust a font size, and boom—feels like magic. But then reality kicks in. You try centring a div, and suddenly you’re questioning your entire existence. Flexbox? Grid? Absolute positioning? That random 4px margin that won’t go away? Welcome to hell.

Here’s a fun challenge: try aligning a button at the bottom of a div while making sure it doesn’t break on mobile. Bonus points if it works across all screen sizes without resorting to !important like a desperate amateur.

The Real Pain Starts with Layouts

Once you move beyond styling buttons and headers, CSS turns into a nightmare puzzle. You add display: flex; hoping it’ll fix everything, but then something weird happens—your divs shrink to zero width. Okay, maybe width: 100% will help? Nope, now it’s overflowing. Maybegridis better? Sure, but now you’ve got gap issues.

And let’s not even talk about floats. If you ever need a lesson in suffering, try using float: left; on a container and see how fast your layout explodes.

The Browser Compatibility War

Just when you think you’ve won, you open the site in Safari and realise—oh, right, Safari exists. Some properties don’t work, flexbox behaves differently, and for some reason, the button you positioned perfectly is now floating in the abyss. Add in Edge, older versions of Chrome, and the abomination that is Internet Explorer (may it rest in pieces), and suddenly, CSS isn’t looking so “easy” anymore.

The Unwritten Rules of CSS

Then there are the mysteries—things that just happen without logic:

  • Margins collapse, but only sometimes.
  • z-index: 9999 still doesn’t bring your element to the front.
  • vh works fine, until mobile keyboards show up and destroy everything.
  • Flexbox is perfect, until you need vertical alignment in a nested container.
  • CSS animations look great—until you add a transition, and everything breaks in weird ways.

Why We Keep Coming Back

For all its quirks, CSS is still one of the most rewarding parts of web development. Nothing beats that moment when everything finally aligns exactly how you want it. The frustration is real, but so is the satisfaction when you master its weird, chaotic logic.

So no, CSS isn’t hard in the way that algorithms or databases are. But it is an untamed beast that will break your spirit if you underestimate it.

And that’s why we love it.