動態添加div導致奇怪的風格分享

Question

當動態添加div到現有的div時，我遇到了一個煩人的問題。我嘗試過使用appendChild函數，還有jQuery的append函數;都給出了相同的結果。你可以看到這個的jsfiddle問題：

http://jsfiddle.net/debu/5b3Qr/

如果按「添加內容」按鈕，這將增加動態生成的申報單。在for循環中，它創建一個div，然後在將其附加到「mainDiv」之前，添加兩個包含文本的div。然後在for循環之外，我創建了另外兩個div。其中一個有適用於它的背景顏色設置爲淺橙色的風格。

的問題是，在for循環中創建的div似乎繼承了這個橙色的背景顏色，即使..好，即使與背景中的元素後添加他們。它不像橙色背景div繼承橙色之後的段落;它保持原樣，白色。

我已經玩了很多這個，發現沒有辦法解決它。有任何想法嗎？

乾杯，

得不

Answer 1

原來您在使用已float:left應用於您添加（compHolder類）的div的問題。 您需要清除popupHeader3與clear:both;才能停止標題的背景，影響這3個div，然後再奇怪地行動。

像這樣：

.popupHeader3 { 
    background-color: #FFBA9B; 
    margin-top:1px; 
    color: #000000; 
    font-family: "ProximaNova"; 
    font-size: 18px; 
    clear:both; 
} 

參見：http://jsfiddle.net/zyZ7Z/