Как сделать так, чтобы при добавлении псевдоэлементов основной элемент не смещался?

Question

[DashaPoliazzz]

Всем привет, подскажите как исправить проблему "скачущей" навигации. При наведении на первый элемент появляется псевдоэлемент "$.", отодвигая при этом навигацию. Подскажите как можно сделать так, чтобы вся навигация оставлась на месте?

https://codepen.io/userUndefined404/pen/popdGWx

Comments

[Вадим]

Ну Вы же уже даже position: relative задали родителю. Осталось совсем чуть чуть. Абсолют псевдо и позиционирование сверху и слева

Answer 1

[Ankhena]

Добавлять псевдо не при наведении, а сразу.
И задавать ему что-нибудь типа visibility: hidden

p.s. псевдоэлементы пишутся с двумя двоеточиями ::before

Comments

[Ankhena]

Альтернативный (плохой) вариант: прибивать псевдо абсолютом, а ссылке задавать отступ на величину псевдо.

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