Mini timelines with CSS

I wanted to add small timelines to a little web-based genealogy proof-of-concept I’m working on, and I realized that it’d be pretty easy to make the tick marks using CSS box-shadows. And it was.

There are some caveats (if you change the background color, you have to edit the CSS to match — you can’t use an rgba color with an opacity of 0 because then the tick marks fill the whole space), but overall it works well.