Things To Avoid When Writing CSS

On the nesting point, you’re on the money. When people using nesting as a way of documenting the exact hierarchy of elements in the DOM, and you get selector specificities of 300+, I die a little inside. Nesting is not documentation. That said, there’s always an unavoidable case or two of needing to prefix n selectors with the same parent class and nesting can come in useful there if used in moderation.

On the file-splitting point, however, I think that’s a misfire. You’re right that it’s not like javascript, CSS developers should not be under the illusion their CSS files are genuinely autonomous. But that’s not why they split. In my teams it’s done to a) reenforce the concept of CSS components (in the sense of the word) being discreet b) to make whole chunks of code easy to remove to reduce filesize where components aren’t needed c) to make code easier to find d) avoid endless CVS merge conflicts in an agile team or 2+.

Also why on earth would you create a file-listing (by which I assume you mean, “sequence of @imports”) alphabetically when you know — as a CSS developer — that specificity is vertical? I have no doubt some noob might do that, but there’s no point in citing inexperienced mistakes as reasons not to do something.

Like what you read? Give Dave Cranwell a round of applause.

From a quick cheer to a standing ovation, clap to show how much you enjoyed this story.