Новости Joomla

0 Пользователей и 1 Гость просматривают эту тему.
  • 4 Ответов
  • 1387 Просмотров
*

Davidich

  • Захожу иногда
  • 179
  • 7 / 1
Привет всем. В вертикальном меню создал выделение при наведении в виде рамки:
Код
.ju-nav-side > li.ju-active > a {
border: 2px solid #9AE101
margin-left: 5px;
margin-right: 5px;

После чего при наведении само меню стало расширяться вниз. Собственно вопрос: как застопорить это меню, что бы оно не расширялось при наведении?
Вот меню:
 

Это при наведении:
*

Shustry

  • Moderator
  • 6434
  • 745 / 3
У вас ссылки в обычном состоянии без отступов и бордеров (предположительно), а при наведении вы увеличиваете размер элемента внешнего (li за счёт отступа ссылки) и самой ссылки за счёт бордера.
1. Отступы нужно прописать одинаковые для обоих состояний.
2. Бордер либо прописать неактивным ссылкам того же цвета, что и фон (тогда их просто не видно будет), либо заменить на outline, это свойство не затрагивает блочной модели в отличии от border.
*

Davidich

  • Захожу иногда
  • 179
  • 7 / 1
Я так и сделал: прописал неактивным ссылкам border:2px solid #7CBB00 с цветом фона и все стало на свои места! Осталось вернуть высоту модуля на место. Спасибо +
*

Davidich

  • Захожу иногда
  • 179
  • 7 / 1
Ну и outline: 2px solid #9AE101 тоже вариант хороший, с ним не надо корректировать высоту модуля.
*

Shustry

  • Moderator
  • 6434
  • 745 / 3
Пожалуйста. А зачем такие тяжёлые селекторы используете?

Код: css
.ju-nav-side > li.ju-active > a {
border: 2px solid #9AE101
margin-left: 5px;
margin-right: 5px;
}

можно заменить на

Код: css
.ju-active a {
border: 2px solid #9AE101;
margin: 0 5px;
}
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Кликабельность псевдоэлемента в пункте меню

Автор vasilii.pupkov

Ответов: 4
Просмотров: 3440
Последний ответ 29.12.2021, 23:15:38
от v42bis
Выпадающее меню

Автор DrShepard

Ответов: 10
Просмотров: 2976
Последний ответ 20.10.2021, 12:36:16
от DrShepard
Как закруглить края выпадающего меню?

Автор coliandra

Ответов: 1
Просмотров: 1462
Последний ответ 11.12.2020, 21:15:57
от effrit
При прокрутке страницы виджет залезает на меню

Автор coliandra

Ответов: 2
Просмотров: 1380
Последний ответ 27.11.2020, 11:33:58
от coliandra
Как при наведении изменить сразу два класса CSS?

Автор Kanfur

Ответов: 3
Просмотров: 1740
Последний ответ 03.11.2020, 16:53:43
от Nikolay89