2015-12-01 13 views
5

私は木のようなシステムを持っています。私がしようとしているのは、すべての両親に最初のものを除いてマージンを与えることです。これは私のHTMLです::not(:first-child)と:not(:first-of-type)は動作しません。

<div id="someDivID"> 
    <div class="theBody"> 
     <div class="someContainer"> 
      <div id="someItem" class="someItemClass"> 
       Test 
      </div> 
     </div> 
     <div class="someContainer"> 
      <div id="someItem2" class="someItemClass"> 
       Test2 
      </div> 
     </div> 
    </div> 
</div> 

そして、私のCSS:

#someDivID 
{ 
    width: 400px; 
} 

#someItem, 
#someItem2 
{ 
    border: 1px solid #000; 
    padding: 1px; 
    margin-bottom: 2px; 
    clear: both; 
    overflow: auto; 
} 

.someItemClass 
{ 
    background-color: #0077FF; 
} 

.someItemClass:not(:first-of-type) 
{ 
    margin-top: 50px; 
} 

、私.someContainerは、背景色を持っているが、第二.someContainerは上マージンを持っていません。 :first-of-typeを削除しても動作します。 :first-childも機能しません。 http://jsfiddle.net/JoshB1997/zsu2o3cg/

first-child付::

first-of-type付:彼らは兄弟ではないのでですhttp://jsfiddle.net/JoshB1997/zsu2o3cg/1/

答えて

17

は、ここに私のjsfiddlesです。

:notセレクタを親divに変更すると、それが機能します。

.someContainer:not(:first-of-type) 
{ 
    margin-top: 50px; 
} 

フィドル - http://jsfiddle.net/ayhpkphw/

+0

それは私のサンプルコードで動作し、良いことです。しかし、私のメインコードははるかに複雑であり、単純に機能しません。私はちょっと試してみますが、これは確かに役立ちます。助けてくれてありがとう。 - 編集:それは今正しく動作します! –

関連する問題