Как устранить смещение при :hover?

Question

[coderxx]

Есть пример где при наведении курсора на элемент меню его border-bottom увеличивается в ширине, что вызывает смещение следующих элементов. Как этого избежать? Обычно в такой ситуации самое простое это задать аналогичный border-bottom элементу в изначальном состоянии со свойством transparent, но в данном случае это невозможно т.к. там border-bottom уже присутствуют. Заранее спасибо!
https://codepen.io/anon/pen/EOMMRG

Answer 1

[Максим Тимофеев]

делайте не через border а через ::after

https://codepen.io/wokster/pen/OaqGLg

Comments

[coderxx]

супер, спасибо.