Member-only story

CSS Anti-patterns

Bob Myers
9 min readSep 14, 2018

--

CSS, like any widely-used technology — and it is widely used because there is basically no way to make web pages without it — has developed around it an entire ecosystem and even, one might say, mythology, as well as a number of anti-patterns which have unfortunately taken root. According to Wikipedia, an anti-pattern is

a common response to a recurring problem that is usually ineffective and risks being highly counterproductive.

My point in noting these anti-patterns is not to criticize (OK, it is a little bit), but to learn from what they can teach us about CSS. Warning: opinions follow.

You might want to read this article on CSS anti-patterns in conjunction with my article on Is CSS a Good Thing™”?

BEM as an anti-pattern

BEM stands for Block-Element-Modifier; I won’t link to it because frankly I don’t think it would be worth the time for the reader to click through. The heyday of the BEM methodology was about a decade ago, but it continues to be used in some pockets of die-hard believers in their underground bunker waiting for their rendezvous with the comet.

The key notion about BEM was to ignore the cascade, and to ignore orthogonality, and to ignore composition, and instead to design singular, monolithic, extremely specific classes, which necessarily had…

--

--

Bob Myers
Bob Myers

Written by Bob Myers

Technologist, writer, Japanologist

Responses (2)