меню css: после селектора?

Question

Привет, мне нужна помощь с этим. Дизайн требует вертикального разделителя строк между каждым пунктом меню, но только когда они не активны. Мне нужно удалить левую границу от a для #current a (уже сделано), а также для следующего a. Мысли

#topmenu ul {margin: 0 0 7px 0; width: 100%;padding: 0;}
#topmenu li {list-style: none;display: inline;margin: 0 0px;padding:15px 10px 15px 0px;
line-height:15px;text-align:center;}
#topmenu a:link, #topmenu a {color: #ffffff;text-decoration: none;margin: 0px 0px 0px 0px;
font-weight:normal;padding: 0px 5px 0px 14px;
border-left-color:#fff; border-left-style:solid;border-left-width:1px;}
#topmenu ul li.item82 a, #topmenu #current  {border:none;}
#topmenu #current:after {border:none;}
#topmenu a:hover{color: #EFEFEF;}
#topmenu a:active{color: #EFEFEF;}
#topmenu #current{color: #EFEFEF;background-color:#19bcb9;-moz-border-radius-topright:4px;
-moz-border-radius-topleft:4px;
border-top-left-radius: 4px;border-top-right-radius: 4px; 
-webkit-border-top-right-radius:4px;-webkit-border-top-left-radius:4px;}

<ul class="menu">
<li class="item82"><a href="/about.html"><span>About Us</span></a></li>
<li class="item62"><a href="/our-philosophy.html"><span>Our Philosophy</span></a></li>
<li class="active item54" id="current"><a href="/services.html"><span>Services</span></a></li>
<li class="item74"><a href="/soutions.html"><span>Soutions</span></a></li>
<li class="item68"><a href="/workshops.html"><span>Workshops</span></a></li>
<li class="item75"><a href="/whats-new.html"><span>What's New</span></a></li>
</ul>

Answer 1

Я думаю, вы ищете удобный денси смежный селектор.Проверьте это на

http://www.w3.org/TR/CSS2/selector.html#adjacent-selectors

Я думаю, что вы хотите

#topmenu #current + a{
border:none
}

, хотя, если вы уже используете JavaScript для добавления #current ID, этобудь то трудно просто добавить класс .noborder.

Answer 2

Смежный соседний селектор + будет работать. Однако в этом случае вам придется применить его к дочернему элементу привязки:

#topmenu #current a, #topmenu #current + li a {
    border-left-color: transparent ;
}

Вместо установки границы на ноль - попробуйте установить цвет на «прозрачный», чтобы выравнивание макета не изменилось.

Answer 3

попробуй

#topmenu #current:after + li {border:none;}

http://www.w3.org/TR/CSS2/selector.html#adjacent-selectors