Стилизация меню
-
Помогите подкорректировать меню.
Это меню для анкоров.
Нужно перед кнопкой СТАНДАРТ убрать вертикальный бордер.
Или-же реализовать бордеры между кнопками по другому.HTML
<ul class="anchors"> <li><a class="anchor1" href="#breed_standard" rel="nofollow">Стандарт</a></li> <li><a class="anchor2" href="#photos" rel="nofollow">Фотографии</a></li> <li><a class="anchor3" href="#video" rel="nofollow">Видео</a></li> <li><a class="anchor4" href="#advert" rel="nofollow">Объявления</a></li> <li><a class="anchor4" href="#comment" rel="nofollow">Комментарии</a></li> </ul>
CSS
.anchors { background:#FFECB2; border-radius:20px; display:inline-block!important; list-style: none; /* убираем маркеры списка */ margin:0 0 20px; min-height:36px; padding: 4px 11px 4px 11px; } .anchors a { letter-spacing:2px; content: ""; border-radius:20px; position:relative; font-weight:700; line-height:36px; border-radius:5px; color:#445056; cursor:pointer; font-size:13px; line-height:36px; margin:0 -4px 0 0; padding:0 10px; text-decoration:none; text-transform:uppercase; font-stretch:normal; font-style:normal; font-variant:normal; transition:all 0.2s linear; } .anchors li a { font-family:'PT Sans', sans-serif; text-decoration: none; background: #FFECB2; font-weight: bold; color: #ffaa00; padding: 6px 10px 6px 10px; } .anchors > li > a:before { content: '|'; color: #626262 !important; padding-right: 19px; } .anchors li {display: inline;} .anchors li a:hover { border-right: solid 1 px #cccccc; padding: 6px 10px 6px 10px; font-weight: bold; background: #ddd; color: #ffffff; border-radius:20px; }
Просмотр 2 ответов — с 1 по 2 (всего 2)
Просмотр 2 ответов — с 1 по 2 (всего 2)
- Тема «Стилизация меню» закрыта для новых ответов.