Fluently speaking CSS and HTML

In recent years, CSS has gotten a bit of a bad rap. Technologies like React have even gone so far as to move component markup and styling into JavaScript, while D3 has long encouraged styling elements in your code. Much of the reasoning for this change is sound: by moving as much of development into a single language, it's easier for developers to get up to speed, and they'll be less frustrated by inheritance and some of CSS's design quirks.

And those design quirks are certainly real, especially around the problem of style isolation. JavaScript modules can be isolated relatively easily, but CSS rules share a single namespace, and it's easy to accidentally collide with third-party code, or even with your own. There's also been long-standing pain points that are only now becoming addressed, especially around app-like layouts (vertical centering is the canonical complaint, but not the only one).

Still: we come here to praise CSS, not to bury it. Despite its flaws, this humble styling language can be an enormous asset to the news developer, since its design goals—art-direction based on grouping and category—dovetail nicely with the process of data visualization. By really digging into CSS, instead of minimizing it, you may find that you're actually more effective than before. In the following chapters, you'll learn more about the actual logic behind the language, and how to take full advantage for your journalism projects.