特定のcssクラスを持つ3rd divの選択方法

Question

<div class="boxcontent"> 

<div>some content this div may be missing [dynamic genrated]</div> 

<div class="elem"></div> 
<div class="elem"></div> 
<div class="elem"></div> 
</div> 

<div class="boxcontent"> 


<div class="elem"></div> 
<div class="elem"></div> 
<div class="elem"></div> 
</div> 


<div class="boxcontent"> 


<div class="elem"></div> 
<div class="elem"></div> 
<div class="elem"></div> 
</div> 

私はcss3セレクタnth-child（3）を使用して選択すると、最初の.boxcontnent divで2番目のdivを選択すると問題が見つかりました。

私はこの最後の時間、彼らの点で私はここにある問題を感じることはありませんが、図で言うとき：

http://jsfiddle.net/szz3C/1/

iは第三のdivまたは全てboxcontentクラスのdiv要素が、最初のボックスで選択したい私3番目の代わりに2番目のdivを選択しました。

は、彼ら」は良い「第三クラスの」セレクタ（または任意の他のリレーショナルクラスベースのセレクタがありません、誰もがこの

Answer 1

を解決できる場合でも、支援のためのCSS3やjQueryの感謝を使用してこの問題を解決するために彼らのいずれかのsollutionですすべての兄弟ベース、オンタイプを含む）。

div.box:nth-last-child(1){ background-color:green; } 

You can try it out here：ここにあなたの最良の選択肢（例を与えられた）

が、それはこのように、親の最後の子だ場合.box<div>を取得:nth-last-child()だろう。

Answer 2

あなたは

.boxcontent .elem+.elem+.elem { /*3rd .elem*/ } 
.boxcontent .elem+.elem+.elem+.elem { /*reset css if there are 4 .elem divs*/ } 

私はあなたが使用することができますね:last-childセレクタ

Answer 3

もあります試みることができる：最後の子を以下IE8とが、すべてのために。それをカバーするためにJqueryを使用しますか？

$(".boxcontent:last-child").css({color:"red"}); 

しかし、私は構造体にとって重要なことをjavascriptには信じていません。

http://www.quirksmode.org/css/contents.html

Answer 4

このCSSを試してみてください：

div:nth-of-type(3) { ... }