2011-07-01 6 views
0

こんにちは私はこれにいくつかの助けが必要です。デザインでは、各メニュー項目の間に縦線区切りが必要ですが、アクティブでないときにのみ使用します。 #current a(すでに終了している)と次のaのために、aから左のボーダーを削除する必要があります。思考?css menu:セレクタの後に?

menu

#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> 
+0

ちょうど私にはliだけでなく、liのリンクを選択する必要があります。 – prophoto

答えて

1

隣接する兄弟セレクタ+が機能します。あなたは、このケースでも、子アンカー要素に適用する必要があります:noneに境界線を設定する代わりに

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

- に「透明」の色を設定してみてくださいようにレイアウトISNのアライメント変わった。

+0

ありがとう、完璧に動作します! – prophoto

1

を試してみてください。あなたはすでにそれが難しいだけで追加することもwouldntの#currentのIDを追加するにはJavaScriptを使用している場合

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

でそれをチェックアウト、私はあなたがが

#topmenu #current + a{ 
border:none 
} 

をしたいあなたのためだと思います。 noborderクラス。

+0

残念ながらそれはうまくいきませんでした。 li#currentの後にli内のaを選択する必要があります。 – prophoto