Вопрос по поводу вертикальных полосок в меню?

Question

[Сергей Васенин]

Нашел данную тему на тостере но не могу понять Почему у меня не получается к сожалению код выложить не могу так как сижу с телефона. Мне не надо решение я хочу понять для усвоения Кто как делает полоску между пунктами в горизонтальном меню? . В меню у меня полоски меньше чем высота блока соответственно есть блок в нем меню у меню ul li и a вот каким образом мне добится результата что бы сделать полоску ниже. Полоску border right

Answer 1

[Eugene Chefranov]

Так?

Comments

[Сергей Васенин]

Не понял что так ?

[Сергей Васенин]

Ну структура меню похожая только без флексов

[Eugene Chefranov]

Сергей Васенин, вам надо чтобы "перегородка" между пунктами была по высоте блока или чуть меньше и отцентрирована по вертикали? Не совсем понял изначально ваш вопрос и в чем у вас проблема

[Сергей Васенин]

Eugene Chefranov, у меня блоки выше чем полоска в макете примерно такая же высота что и текст

[Eugene Chefranov]

Сергей Васенин, добавил пример в начальное свое сообщение. Там сделал на псевдоэлементах. Если принципиально на border-right сделать, то можно через градиент попробовать.

[Талян]

У тебя полоски ниже, потому что у списка в блоке стоит padding.

Покажи свой код, и мы исправим тебе в твоём коде то, что нужно.

[Сергей Васенин]

Eugene Chefranov, а других решений нет с сокращением кода. Просто код мне кажется слишком громоский для каких то полосочек

[Eugene Chefranov]

Сергей Васенин, 10 строчек такого кода никак не повлияют на читаемость кода)

[Сергей Васенин]

Eugene Chefranov, а с браузерами и мобилками как ?

[Сергей Васенин]

Eugene Chefranov, еще такой вопрос если не сложно ответить. В той теме кто говорил размеры полосок можно уменьшить прописав классу сылки. Не совсем его понял

[Eugene Chefranov]

а с браузерами и мобилками как ?

Сергей Васенин, с псевдоэлементами будет везде работать, а вот если использовать градиент, то в старых IE могут быть проблемы

[Ankhena]

Сергей Васенин, Eugene Chefranov Можно сократить, если не перебивать стили для последнего элемента, а писать :not(:last-child) (либо симметрично для first)

[Сергей Васенин]

Ankhena, не совсем понял как это реализовать если можно пример какой нибудь привести. Я извиняюсь за большое количество вопросов.

[Eugene Chefranov]

Сергей Васенин, обновил пример с учетом подсказки Ankhena

[Сергей Васенин]

Eugene Chefranov, а можно еще как то первый код оставить как домой приду посмотрю что да как и как лучше применять . Спасибо вам большое

[Eugene Chefranov]

Сергей Васенин, там небольшая разница, потому текущий вариант самый оптимальный

[Сергей Васенин]

Eugene Chefranov, спасибо