Вертикально центрированные точки с CSS

Как я могу сделать точки между ссылками, вертикально центрированными только с CSS? Это возможно, но я не могу понять, как это сделать.

Ожидаемое:

HTML

<label><a href="#">Like</a></label>
<label><a href="#">Comment</a></label>
<label><a href="#">Share</a></label>
<label><span>1 hour ago</span></label>

CSS

a{ 
    vertical-align: middle;
}

label:not(:last-child):after{
    content: " . ";
}

Не работает пример: http://jsfiddle.net/4ZFMm/

Спасибо!

Ответ 1

Используйте · · для точки или • • для более толстой, маркированной точки стиля списка.

Для использования в атрибуте content вам нужно его избежать:

Мидот:

content: " \B7 ";

бык:

content: " \2219 ";

Refrences:

Ответ 2

Каким-то образом это навязалось на реальном сервере, хотя они работали локально, вот что сработало для меня, может быть, это поможет кому-то еще:

.element:before {
    content: "\2022";
}