CSS acil çocuk seçici

Question

#main .container > div:not(.sites):not(.default) { 
    display: none; 
} 

<h1> etiketi görülebilir. > Yalnızca acil çocuklar için geçerliyse, nasıl olur da benim yui-ge benim için yukarıdaki CSS'ye sahip oluyor (hem Chrome hem de Firefox'ta).

<div class='container'> 
    <div class='default selected'> 
     <h1>Page Title</h1> 
     <div class='yui-ge'> //for some reason, this tag remains hidden cause of the above CSS 
      //more div tags 
     </div> 
    </div> 
    //more HTML here 
</div> 

güncelleme

burada

Görünüş: --link REMOVED--

"Woot" sekmesine tıklayın .... sonuç varsayılan woot sekmesinde gösterilir - onlar gizli kalması .

#main .woot > div:not(.sites):not(.default) { 
    display: none; 
} 

Bu kural sınıfları sites veya default olması ve .woot elemanın çocukları yok #main eleman içindeki tüm DIV öğeleri için geçerlidir:

Answer 1

Bu CSS kuralını var. Gördüğünüz gibi

<div id="main"> 
    <div class="woot"> 
     <div class="woot default selected"> 
      <div class="yui-ge"> ... </div> 
     </div> 
    </div> 
</div> 

, .yui-ge DIV class sites ne de default yoktur ve bir .woot öğesinin içinde geçerli:

Kişisel yapıdır. Bu nedenle, gizlenecektir.

---

sorun

Sınıfa woot sahip atası zincirinde iki DIV'leri olması.

Answer 2

Bir öğeyi gizlerseniz, tüm alt öğeleri de gizlenir.