類型內不能工作時內部Div

Question

我試圖改變div內的奇數div的風格。由於某種原因，第n種（奇數）影響所有我的div當它在另一個div內時。這裏是我的兩個常規的DIV和奇div的CSS代碼..

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

出於某種原因，「第N-的類型」沒有我的div內包裹的時候工作，但沒有工作的時候他們沒有被包裹在任何divs裏面。

不工作版本時，裏面的div包裹：http://jsfiddle.net/EMXYy/1/

邊欄注： DIV的類名爲「視頻入門總結http://jsfiddle.net/EMXYy/

工作版本時，裏面的div不換行「應該是在ID爲」後240「的div中。如果您嘗試解決此問題，請不要刪除這些div。 :)

Answer 1

:nth-of-type()與:nth-child()類似，因爲它們必須全部來自同一父級。如果您需要這些包裝div S，用這些包裝代替: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; 
}