Применение стиля к меню

Подскажите пожалуйста, имею два меню (скриншот), при наведении на пункт меню появляется выделение пункта, выделение с радиусным бордером по правую сторону, т.к. меню есть правое и левое, нужно сделать меню с радиусным бордером по левую сторону, собственно вопрос как??
понимаю что через суффикс меню, вроде все элементарно, но как именно, понять не могу. куда нужно добавить суффикс и как его правильно вставить в модуль.

#header ul.menu
{
   /* top:62px; */
   top:2em;
   #top:5em;
   padding: 0px 0px 0px 5px ;
   #background:#e0e0e0 url(../images/personal/ecke.gif) top left repeat-x ;
   text-align:left;
   left:0px;
   display:block;
   margin:0px 10px 0 10px;

}

#header ul.menu li
{
border:0; margin:0 !important;
}

#header ul.menu li a:link,
#header ul.menu li a:visited
{

   color:#fff;
   #border:0 ;
   #border-right:solid 1px #ddd;
   margin:0px 0 0 0 ;
   padding:8px ;
   position:relative;
   #background: #e0e0e0 url(../images/personal/ecke.gif) repeat-x top left;
   display:block;
   padding-left:20px;

}

#header ul.menu li a:hover,
#header ul.menu li a:active,
#header ul.menu li a:focus
{
   background: url("

") transparent;
   color:#000;
   #border: 1px solid #FFF;
   border-top-right-radius: 8px;
   border-bottom-right-radius: 8px;
   padding-left:20px;
   #0d4c89 ;
}

#header ul li.active a:link,
#header ul li.active a:visited
{
   color:#000;
   background:url(../images/personal/stripe_90.png);
   #border-radius: 8px;
   border-top-right-radius: 8px;
   border-bottom-right-radius: 8px;
   #text-shadow: 1px 1px 1px #000;
}

#header ul.skiplinks
{
   width:100%;
   text-align:left;
   background:none;
   z-index:20000;
   top:0;
   display:inline;
   padding:0
}

#header ul.skiplinks li a.u2:active,
#header ul.skiplinks li a.u2:focus

{
   background:#095197 !important;
   color:#fff !important;
   border:solid 1px;
   top:0 !important;
   z-index:10000;
   right:auto;
   left:0 !important;
   display:block
}

[вложение удалено Администратором]

#header.right ul.menu li a:hover, #header.right ul.menu li a:active, #header.right ul.menu li a:focus { background: url("http://catalog.ru/templates/beez_20/images/personal/stripe_90.png") transparent; color:#000; #border: 1px solid #FFF; border-top-left-radius: 8px; border-bottom-left-radius: 8px; padding-left:20px; #0d4c89 ; } #header.right ul li.active a:link, #header.right ul li.active a:visited { color:#000; background:url(../images/personal/stripe_90.png); #border-radius: 8px; border-top-left-radius: 8px; border-bottom-left-radius: 8px; #text-shadow: 1px 1px 1px #000; }

Кликабельность псевдоэлемента в пункте меню Автор vasilii.pupkov	Ответов: 4 Просмотров: 5726	29.12.2021, 23:15:38 от v42bis
Выпадающее меню Автор DrShepard	Ответов: 10 Просмотров: 4804	20.10.2021, 12:36:16 от DrShepard
Как закруглить края выпадающего меню? Автор coliandra	Ответов: 1 Просмотров: 3236	11.12.2020, 21:15:57 от effrit
При прокрутке страницы виджет залезает на меню Автор coliandra	Ответов: 2 Просмотров: 2925	27.11.2020, 11:33:58 от coliandra
Как убрать маркер только из одного пункта меню. Автор kuraev64	Ответов: 2 Просмотров: 3026	20.07.2020, 11:18:44 от kuraev64

Применение стиля к меню - Вопросы по CSS

Новости Joomla

Вышли релизы Joomla 6.1 и Joomla 5.4.5: новые возможности и стабильность

👩‍💻 Компонент "CS Афиши" для Joomla.

Яндекс выпустил инструмент Видимость сайта в Алисе AI.

blind

Применение стиля к меню

Babyaka

Re: Применение стиля к меню

Похожие темы