2012-12-04 13 views
7

मैं div के अंदर मौजूद विषम divs की शैली को बदलने की कोशिश कर रहा हूं। किसी कारण से nth-of-type (विषम) मेरे सभी divs को प्रभावित कर रहा है जब यह किसी अन्य div के अंदर है। यहाँ दोनों नियमित div और अजीब divs के लिए मेरे सीएसएस कोड ..एनएच-ऑफ-टाइप काम नहीं कर रहा है जब Div

.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; 
} 

किसी कारण, "वां के- प्रकार" जब मेरे divs के अंदर लिपटे काम नहीं करता है, लेकिन काम जब करता है वे किसी भी divs में अंदर लपेटा नहीं है।

काम नहीं कर रहा संस्करण जब div अंदर लिपटे:http://jsfiddle.net/EMXYy/1/

साइडबार नोट:: div कक्षाएं शीर्षक "वीडियो प्रवेश सारांशhttp://jsfiddle.net/EMXYy/

कार्य संस्करण जब div अंदर लिपटे नहीं "आईडी के साथ" 240 के बाद "div के साथ divs में होना चाहिए। यदि आप इस समस्या को ठीक करने का प्रयास करते हैं, तो कृपया इन divs को न हटाएं। :)

उत्तर

14

:nth-of-type():nth-child() के समान है कि वे सभी एक ही माता-पिता से होंगे। आप उन आवरण div रों की जरूरत है, बजाय उन रैपर पर :nth-of-type() का उपयोग करें:

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; 
} 

सभी भाई बहन .post कर रहे हैं, :nth-child() बजाय का उपयोग what :nth-of-type() really means के साथ भ्रम को रोकने के लिए:

.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

काम कर समझ लिया, धन्यवाद एक बहुत! – user1658560

संबंधित मुद्दे