Stabilising a fast updating timer with one line of CSS

I added milliseconds to the workout timer in SquadWOD the other day and an interesting problem reared it’s head. I’m not using a mono-spaced font and so my timer went from looking fine to bouncing around like a downhill mountain biker.

Not the most annoying thing happening in a CrossFit workout but pretty annoying nonetheless

Fortunately this is very simple to fix, simply add font-variant-numeric: tabular-nums; css property and you get:

Ahh, much better