CSS Dojo道場 · practice
All levels

Count with counters

Level 5 of 9

Your goal

Number the items with your own counter: counter-reset on .list, counter-increment on .item, and content: counter(...) in .item::marker. The items don't move; the properties are what's checked.

Must usecounter-resetcounter-incrementcontent
target content boxtarget outer edge (green = matched, red = not yet)
Feedback updates as you type, and your CSS is saved in this browser. Exact target numbers are in the Target panel.