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

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

Ожидаемое:

Facebook inline list: Unlike, Comment, Share, 1413, 70, 76, about a minute ago

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

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

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

Мидот:

content: " \B7 ";

бык:

content: " \2219 ";

Refrences:

Ответ 2

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

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