Как сделать такое меню?

Question

[Alexander]

Можно ли как-то сделать такое меню, но без лишних пустых li ? без флексбоксов? или еще как-то более красиво в плане реализации? Может решение на поверхности, а я его не вижу...
https://codepen.io/Alexander_Krymov/pen/ZXVMjv

Comments

[one_day]

псевдоклассом
вот как здесь

[Ankhena]

Варианты:
1. псевдоклассы
2. правый border у всех кроме последнего (или левый у всех кроме первого)

Если не подходит флекс, то инлайн блоками или display:table

[Alexander]

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

Answer 1

[mdss]

А чем флексы не устраивают?
Вот решение на основе свойства display table
https://codepen.io/mdss/pen/vevQEJ

Comments

[Alexander]

может я не совсем правильно объяснил. Первый и поледний пункты должны быть прижаты к краям, и расстояния от текста ссылки до разделителя(черточки) должны быть равномерные. prntscr.com/gyyh4p
Флексы в принципе устраивают, но даже с ними не получается такое сделать без пустых li.

[mdss]

Александр Крымов, если без них, то понадобится дополнительная обертка. Что по сути не является решением
https://stackoverflow.com/a/41632218/8288421

[Alexander]

mdss, спасибо! Не понял, о какой доп. обертке вы говорите, вроде разметка остается чистая (ul > li > a) и все. На мой взгляд это то, что нужно!)