爲什麼我的div標籤的高度在Chrome中被計算爲0？

我正在使用網頁（link text），但我在Chrome瀏覽器中遇到了高度屬性問題。如果您查看該頁面，您會注意到沒有背景顏色。這是因爲#mainContent的高度爲0px。在Internet Explorer中，情況並非如此。有沒有人有想法？爲什麼我的div標籤的高度在Chrome中被計算爲0？

來源

2010-07-24 Quentamia

這是因爲內容正在浮動。父母要素並不佔據漂浮的孩子的高度。嘗試將overflow: hidden;添加到#mainContent css。

來源

2010-07-24 01:45:06

-2

嘗試明確定義默認值

height：auto;

來源

2010-07-24 01:44:18 isildur4

#mainContent內的所有內容都是浮動的。浮動不會調整其容器大小。最簡單的解決辦法是增加一個明確的權利在此之前結束#mainContent像這樣：

<div id="mainContent"> 
<!-- inner bars --> 
<div style="clear:both;"></div> 
</div>

來源

2010-07-24 01:47:16 anq

這是一個「hacky」解決方案（我確信有更多的「語義」方法），但它是最簡單和最常用的方法之一。 +1 – 2010-07-24 01:51:08

絕對正確。我從來不喜歡這樣做，因爲它很混亂，但它非常簡單並且得到很好的支持。 – anq 2010-07-24 02:01:57

這一個工作，以及添加溢出：隱藏到CSS意味着我不必單獨修改每個頁面。我喜歡更好一點。 – Quentamia 2010-07-24 18:37:49

我有一種感覺這將是什麼做的#mainContent的內容DIV無法正常壓出容器。你應該可以通過多種不同的方式解決這個問題，比如使用清理div。

添加以下的CSS：

.clearfix{ 
    clear:both; 
}

和關閉搜索Maincontent格前添加與clearfix類一個div：

<div id="mainContent"> 
    <div id="rightSide"> 
    ... 
    </div> 
    <div id="content"> 
    ... 
    </div> 
    <div class="clearfix"/> 
</div>

這應該提醒瀏覽器強行打開搜索Maincontent格，以適應其內容。

來源

2010-07-24 01:51:43

哈哈，這將是一個很難回答的問題，因爲有多種方法可以清除浮標。（您也可以嘗試將#mainContent浮動）

以下是精彩的quirksmode article。

來源

2010-07-24 01:51:58 attack

爲什麼我的div標籤的高度在Chrome中被計算爲0？

回答

相關問題