Compiling Symbolic Cheat Sheets of CSS Specificity

Had way too much fun doing that title.

Metaphors are an invaluable teaching tool, and for the apparently esoteric feature of CSS specificity that only 43% on Twitter could answer correctly, these resources are worth revisiting (as in, these have been around for years now). Take your pick:

πŸ¦‡ Batman

Batificity
Batificity by Mandy Michael

πŸ‘­ The Shining

CSSSpecificity.com
CSSSpecificity.com

🐟 Fish

Specifishity
Specifishity by Estelle Weyl

🌐 Star Wars

Specificity Wars
Specificity Wars by Andy Clarke

It’s called Cascading Style Sheets for a reason, guys ;)


Worse: what I saw on rant and hot take Twitter is people complaining about having to memorize these rules, and that it’s gatekeeping to tell people you should know these basic things already. It’s…crazy out there.

⋆ Hi! Thanks for stopping by ⋆

Design × Code × Words for a better Web,
made in the Philippines by Sophia Lucero.