2010-12-16 63 views
1

任何人都會在任何web開發工具(Firebug,IE9,Chrome Dev Tools)中檢查此頁並告訴我爲什麼#container div不會在Firefox中自動調整大小?應該有一個背景陰影,在大多數瀏覽器中都可以看到,但在FF中不顯示。思考?Div在Firefox中不自動調整大小

http://d2burke.com/hosted/vaacme/

謝謝!

+0

我看到,在Firefox中,CSS是略有不同: 「URL(」 ../圖像/ PageShadow.png「) repeat -y滾動0 0透明「比較」背景:url(http://d2burke.com/hosted/vaacme/images/PageShadow.png)repeat-y;「在Chrome中。你知道這是什麼原因嗎? – 2010-12-16 04:22:46

回答

2

由於內部#container所有元件被浮置,在其內部一切被取出正常文檔流的,並且因此它收縮到虛無,因爲它具有零填充和高度。爲了解決這個問題,你可以申請:

#container { 
    overflow: hidden; 
} 

或刪除:

.break { 
    float: left; 
} 
+0

爲什麼然後在Chrome中工作? – Fred 2010-12-16 04:31:21

+0

溢出:隱藏的伎倆。那麼爲什麼要將所有元素都「從普通文檔流中取出」? – d2burke 2010-12-16 04:31:53

+0

@ d2burke這就是浮動工作方式 - 它將正常頂部的特定元素從下往上移動,並根據您爲「浮動」屬性定義的值向左或向右移動它。看到這個更多的信息:http://reference.sitepoint.com/css/floatclear – 2010-12-16 04:37:09