2016-08-24 101 views
0

我想爲位於同一個容器下的2個元素分配一個公共背景顏色。如何在浮動子元素中設置背景顏色?

我已經爲這兩個元素設置了id;第一個元素爲left,第二個元素爲right。 左邊有float:left,右邊有float:right,寬度爲45%。該容器的寬度爲80%,餘裕和餘裕權設爲auto

當在容器上設置background-color時,孩子的背景顏色都不會改變,但是在其左側元素上設置background-color時它的工作原理。

如何爲兩個子元素設置背景顏色?

+2

不要在孩子只在母體使用的背景顏色。 – z3nth10n

+2

你能提供一個jsfiddle或者一些代碼嗎? – mmmoustache

+0

使用瀏覽器的檢查器工具...當你浮動元素時,將它們從正常的文檔流中移除。現在你的容器的高度將爲'0',這意味着沒有背景可以顯示。 – skyline3000

回答

0

當你float元素,他們從正常的文檔流程中刪除。您的容器現在具有0的高度,這意味着沒有顯示背景的高度。爲了解決這個問題,你可以在容器上設置overflow:auto

請參閱這篇文章CSS漂浮一個解釋:http://www.quirksmode.org/css/clearing.html

+0

非常感謝! –