2012-12-04 7 views
7

Bir div içindeki garip divlerin stilini değiştirmeye çalışıyorum. Bir sebepten dolayı,-tipi (tek), başka bir div içinde olduğunda tüm div'larımı etkiliyor. Burada düzenli div ve garip divlere hem benim CSS kodu .. nedense, benim div içinde sarılı zaman "N.-of-Type" çalışmıyor içinNth-of-Type Div İçindeyken Çalışmıyor

.video-entry-summary { 
    width:214px; 
    height:210px; 
    margin-left:10px; 
    float:left; 
    position:relative; 
    overflow:hidden; 
    border:1px solid black; 
} 

.video-entry-summary:nth-of-type(odd) { 
    width:214px; 
    height:210px; 
    margin-left:0px; 
    float:left; 
    position:relative; 
    overflow:hidden; 
    border:1px solid black; 
    background:#ccc; 
} 

olmakla işi yaparken yapar herhangi bir div içinde sarılı değiller.http://jsfiddle.net/EMXYy/1/

Kenar çubuğu Not: div sınıfları başlıklı "video giriş özeti div içine sarılmış değilkenhttp://jsfiddle.net/EMXYy/

Çalışma Versiyon:

Çalışmıyor Versiyon div içine sarılmış zaman "kimlikleri" post-240 "gibi olan divlarda olması gerekiyordu. Bu sorunu gidermeye çalışırsanız, lütfen bu div'leri kaldırmayın. :)

cevap

14

:nth-of-type() hepsi aynı ebeveynden olmalıdır ki :nth-child() benzer. what :nth-of-type() really means ile karışıklığı önlemek için tüm kardeşler .post ise

div.post:nth-of-type(odd) .video-entry-summary { 
    width:214px; 
    height:210px; 
    margin-left:0px; 
    float:left; 
    position:relative; 
    overflow:hidden; 
    border:1px solid black; 
    background:#ccc; 
} 

yerine :nth-child() kullanın: Eğer bu sarıcı div s gerekiyorsa, bunun yerine bu sarmalayıcılar'ı :nth-of-type() kullanmak

.post:nth-child(odd) .video-entry-summary { 
    width:214px; 
    height:210px; 
    margin-left:0px; 
    float:left; 
    position:relative; 
    overflow:hidden; 
    border:1px solid black; 
    background:#ccc; 
} 
+0

çalışma Anladım, teşekkürler çok! – user1658560