Fancy dropdown list?

Question

css

Can anyone come across this type of list (in front of each point - a list item)? Now it is border-left + after-elements (circles). How to make such a border "rubber", i.e. so that, with different numbers of words in the lists, it stretches (has different distances m / d points (circles), if necessary)?

Answer 1

https://jsfiddle.net/6y1fjc37/ like this (dot is always centered)
https://jsfiddle.net/6y1fjc37/1/ or like this (dot is fixed)
https://jsfiddle.net/6y1fjc37/3/ and like this ( hide parts of the strip)

Answer 2

Well, just the border-left solves your problem -)
You set the height of the line for each li and make circles through before.