CSS min-height在mozilla firefox上不起作用

我用min-height創建了一個div標籤，並給出了背景顏色'red'。但在Mozilla Firefox中，當內容跨越最小高度限制時，div的高度不會增加。繼承人我的代碼：CSS min-height在mozilla firefox上不起作用

<style type="text/css"><!-- 
ul { 
    display:block; 
    padding:0px; 
    width:500px; 
} 

.b { 
    width:250px; 
    float:left; 
    display:block; 
} 

div { 
    min-height:50px; 
    width:500px; 
    background-color:red; 
} 
--></style> 

<div> 
    <ul> 
     <li class="b">asdsad</li> 
     <li class="b">asdsad</li> 
     <li class="b">asdsad</li> 
     <li class="b">asdsad</li> 
     <li class="b">asdsad</li> 
     <li class="b">asdsad</li> 
     <li class="b">asdsad</li> 
    </ul> 
</div>

它似乎在div高度將必須設置以適應內容，但我不知道我還能怎麼辦that.if我不使用高度則背景顏色可以不要設置。請告訴我如何將內容適合div以及背景顏色是紅色。
（不知道我是否解釋清楚，請問我是否想更多瞭解這個問題。）

- 謝謝。

已解決：謝謝大家的好評。

來源

2012-12-27 user1844626

爲什麼你不給高度，並明確這兩個div？讓我知道？ –

對不起，我不明白你說的是什麼意思。請你說清楚我的意思嗎？ – user1844626

你需要什麼你有固定李寬度，也是它的父寬度它似乎在這個div只有李對來？請詳細解釋一下 –

更新你的CSS是這樣的：

div{min-height:50px;width:500px;background-color:red;overflow:hidden;}

overflow:hidden;添加

基本上，這種情況發生在float:left因爲.b類。這就是它的工作原理。通常情況下，您可以通過將overflow:hidden添加到父div或通過添加style =「clear：both;」的元素來修復它。在父div的末尾。

您可以使用'CSS clearfix'關鍵字搜索關於它的更多信息。

來源

2012-12-27 10:36:28

非常感謝，有效！我添加了溢出：隱藏到'div'。6分鐘後我會接受這個答案（這是什麼信息說）。感謝您的幫助... – user1844626

將overflow: hidden;添加到ul。

問題是你的LI是浮動的，導致父母不知道它的內容的高度。

來源

2012-12-27 10:36:50

你必須清楚這樣的嵌套裏標籤的浮動：在所有的主流瀏覽器支持

ul:after { 
    content: "."; 
    display: block; 
    clear: both; 
    visibility: hidden; 
    line-height: 0; 
    height: 0; 
}

來源

2012-12-27 10:37:23

的最小高度屬性。

但是這個屬性不適用於firefox上的html表格。

來源

2013-10-09 07:23:51 SwR

謝謝。它似乎不適用於任何'display：table- *'元素的Firefox（錯誤307866）。 – Nickolay

在Firefox上，min-height未在display: table(-*);屬性上解釋，因此試圖使用height: 50px;而不是解釋爲表格上的最小高度。

Source

來源

2014-08-29 13:22:46

所以你可以使用'min-height'，如果你也使用'display：block;'來覆蓋'display：table（ - *）;' – landi

經過多番考慮並且頭腦靈活：yup。只需使用普通的舊高度。 http://codepen.io/squarecandy/full/wWLNAV/ – squarecandy

當元件的顯示被設置爲表，火狐將忽略最小高度屬性，而無需實際設置的高度。

通過切換元素顯示：block，firefox然後尊重最小高度屬性。

來源

2015-05-11 18:09:44 skribbz14

我增加了以下內容，它的工作：

body { 
    height:100%; 
}

來源

2016-03-03 08:53:53

，而不是最小高度：50像素;只需添加填充：25px 0;

來源

2017-01-09 14:17:28 Fadi

CSS min-height在mozilla firefox上不起作用

回答

相關問題