鉻在劃分科師的造型

Question

我有一個CSS子級問題。通常人們似乎爲特定的班級定義了一種風格。這是我開始與：

.divholder { 
    width:750px; 
    border:none 
    font-size:12; 
    display:inline-block; 
    overflow: hidden; 
    white-space: nowrap; 
    } 

.five { 
    width:100px; 
    display:inline-block; 
    overflow: hidden; 
    white-space: nowrap; 
    float:left; 
    } 

這工作得很好，使分區與五個細分內更大的一個。它目前擁有五個選項的在線形式的按鈕，所以五個。 現在我試圖在我的CSS文件中指定除法，以便我不必經常在html部分中定義div class =「...」。這看起來如下：

form.cmxform div { 
    width:750px; 
    border:none; 
    font-size:12; 
    display:inline-block; 
    overflow: hidden; 
    white-space: nowrap; 
    } 

form.cmxform div div { 
    width:100px; 
    display:inline-block; 
    overflow: hidden; 
    white-space: nowrap; 
    float:left; 
     } 

該規範是簡單地從類，它在鉻和IE工作良好的複製。 奇怪的是，當我應用上述子規範時，它適用於IE，但不適用於Chrome。 Chrome將每個部門都與較低的代碼分開，但不包含頂部的代碼。有沒有人知道爲什麼會出現這種情況，以及我如何解決這個問題？ 感謝您的任何建議或評論！

*編輯 html代碼適用於如下：

<li><label>&nbsp;</label><div><div class="five">Zeker Niet</div><div class="five">&nbsp;</div><div class="five">&nbsp;</div><div class="five">&nbsp;</div><div class="five">Zeker Wel</div></div></li> 
    <li><label>&nbsp;</label><div><div>--</div><div>-</div><div>0</div><div>+</div><div>++</div></div></li> 

頂線，其中DIV類是specifiek行之有效的Chrome和IE9，但線下它只能在IE9中，除了Chrome

Answer 1

[更新]

隨着你的語法，form.cmxform div的CSS將影響你的多個嵌套divs。

要訪問層次結構上特定級別的子元素，請使用form.cmxform > div和form.cmxform > div > div和>訪問直接後代。

在你的榜樣，你需要寫：

form.cmxform li > div { 
    display:inline-block; 
    overflow: hidden; 
    white-space: nowrap; 
    width: 750px; 
} 

form.cmxform li > div > div { 
    text-align:center;  /* added for style */ 
    width:100px; 
    float:left; 
}