IIIu6ko
@IIIu6ko

Как скрыть бордер предыдущего элемента?

У каждого пункта меню есть :after, который выполняет роль бордера с правой стороны.
При ховере цвет фона пункта изменяется на аналогичный бордеру. Бордер элемента на который навели скрывается, а вот предыдущего элемента остаётся выпирать, это видно если навести на второй или третий пункт меню.feeaf4ffae074e3daf3d0cd55247ebd9.jpg
https://jsfiddle.net/s7z50fjc/

Как скрыть after предыдущего пункта меню? Либо как можно реализовать иначе подобный дизайн? Я временно решил проблему смещением элемента влево на ширину after, но это смотрится не очень.
  • Вопрос задан
  • 177 просмотров
Решения вопроса 2
ivan_tataush
@ivan_tataush
Frontend Developer
как вариант можно так попробовать
https://jsfiddle.net/s7z50fjc/2/
Ответ написан
hvdd
@hvdd
Кратко о себе
Можно скрывать ::before у следующего пункта меню с помощью соседнего селектора +.
Ответ написан
Пригласить эксперта
Ответы на вопрос 2
@aslanovich
Web/Art Designer. Front+Back-end Geek
Ну как вариант при ховере можете добавить правый бордер item - у зеленого цвета, который будет перекрывать этот символ (разделитель)
Ответ написан
romy4
@romy4
Exception handler
а почему нельзя это сделать без :after?
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы