Turn that frown upside down

I got an email that went like this (lightly edited for readability):

CSS makes me sad.

I've been programming web apps for more than a decade now. I can architect the thing, load every required data, make all the hops and jumps until I have a perfectly crafted piece of markup with relevant info.

And then I need to put a box to the left of another box. Or add a scrollbar because a list is too big. Or, god forbid, center some text.

I waste hours and feel worthless and sad. This only happens with CSS.

I think this is a matter of practice. I bet you practice all of the other technologies involved in building the sites you work on more than you practice CSS. If it's any consolation, there are loads of developers out there who feel exactly the opposite. Designing, styling, and doing web layout are easy to them compared to architecting data.

I have my doubts that CSS is inherently bad and poorly designed such that incredibly intelligent people can't handle it. If there was some way to measure it, I might put my money on CSS being one of the easier languages to get good at, given equal amounts of practice time.

In fact, Eric Meyer recently published a CSS: The Definitive Guide, 4th Edition, which is more than twice as thick as the original version, yet says:

CSS has a great deal more capabilities than ever before, it’s true. In the sense of “how much there potentially is to know”, yes, CSS is more of a challenge.

But the core principles and mechanisms are no more complicated than they were a decade or even two decades ago. If anything, they’re easier to grasp now, because we don’t have to clutter our minds with float behaviors or inline layout just to try to lay out a page.

One way to digest that might be: if you feel snakebitten by past CSS, it's time to try it again because it's gotten more capable and, dare I say, easier.

We can also take your specifics one-by-one:

And then I need to put a box to the left of another box.

Try flexbox!

See the Pen GyZMrj by Chris Coyier (@chriscoyier) on CodePen.

Or add a scrollbar because a list is too big.

Or, god forbid, center some text.

The overflow property is great for handling scrollbar stuff. You can even style them. And we have a whole guide on centering! Here's a two-fer:

See the Pen Centered Scrolling List by Chris Coyier (@chriscoyier) on CodePen.

Best of luck!

---

Turn that frown upside down is a post from CSS-Tricks

from CSS-Tricks http://ift.tt/2BFgLc7
via IFTTT