Разделители меню "|"

[Евгений_SB]

Ребят раскажите кто как делает разделительные черточки меню "|"

всегда делал так

after{

content: ' | ';

}

 

но так постоянно приходиться подгонять маргинами чтобы он был посередине

некоторые делают бордерами но как быть если сама черточка меньше блоков ?

подгружать дополнительное избражение для полоски думаю не есть хорошо, может  у кого то есть вариант как сделать без подгрузки изображения

Edited June 19, 2014 by Евгений_SB

[npofopr]

Да хоть как. Модно теперь через :after, как и вы делаете.

Во времена прошлые картинками с абсолютом. 

 

А какая разница какая длина\ высота черты? width и height никто не отменял.

[Catherine]

Можно бордером, можно псевдоэлементом. Если нужен символ меньшего размера - соответственно псевдоэлементу задается меньший шрифт. Можно указывать не символ "|" , а абсолютно позиционированный элемент с нужной высотой и шириной, либо нулевой ширины но вертикальным бордером необходимого размера. Можно задавать vertical-align смещаемому псевдоэлементу, можно маргин, если необходимо вертикальное смещение. Вариантов много, универсального решения нет, всё зависит от задачи и личных предпочтений.

[Игорь Ермаков]

подгружать дополнительное избражение для полоски думаю не есть хорошо

Не правильно.