Phase 01The cascade, specificity and inheritance51 of 434
Selector Hunt
Hit the target elements and nothing else, in as few characters as you can manage. Precision under time pressure.
Drill18 minAI off
The scoring rewards two things at once: hitting every target, and hitting nothing else. Over-matching is the failure mode that matters, because in a real stylesheet an over-broad selector does not error, it quietly styles something three components away and you find out in code review, or you do not.
Play a few rounds, then deliberately try the harder route: solve a level with a structural pseudo-class instead of a class. It will be longer to type and it is the one you will reach for when you cannot edit the HTML.
Selector Hunt
Write one CSS selector that hits every target element and nothing else.
Play Selector HuntYou should now be able to
- Write a precise selector quickly
- Avoid over-matching under time pressure
Loading…