添加更多文本時CSS DIV不擴展

我有一個快速的CSS問題，我希望有人能幫助我！添加更多文本時CSS DIV不擴展

我有一個名爲#ContentPanel的DIV，我希望它能夠擴展，以便它可以滿足需要的更多文本。目前，如果文本長度超過500像素（如CSS中指定的那樣），它會從底部流出並覆蓋下面div中的內容。我如何設置它自動展開並向下推動所有div。

如果任何人有任何想法，請讓我知道

這裏的HTML

<div id="MainContent"> 
    <div id="MainImage"></div> 
    <div id="ContentPanel">Text content goes here.</div> 
</div>

...這是在CSS

#MainContent { 
    position:relative; 
    height:500px; 
    width:800px; 
    margin:0 auto; 
    background-color: #000; 
} 

#MainImage { 
    position:absolute; 
    top:0; 
    left:0; 
    width:350px; 
    height:500px; 
    background-color:#000; 
} 

#ContentPanel { 
    position:absolute; 
    height:500px; 
    top:0; 
    left:350px; 
    width:450px; 
    background-color:#000; 
}

提前感謝！

親切的問候，

Decbrad

來源

2010-04-10 decbrad

對於html/css問題plz發佈他們在doctype.com謝謝！ – 2010-04-10 14:37:49

你需要使用min-height CSS屬性

來源

2010-04-10 14:37:03 Midhat

使用min-height而不是height。

除IE 6外：它有一個bug，所以它解釋爲height就像min-height。

來源

2010-04-10 14:37:28

嘗試設置最小高度（最小高度:)而不是特定的固定高度。

來源

2010-04-10 14:37:36 dannywartnaby

你以後的屬性是最小高度，而不是高度。

http://www.w3schools.com/CSS/pr_dim_min-height.asp

這意味着你的內容將是至少高。如果內容保證，高度將超過指定值。

來源

2010-04-10 14:39:49 Garethr

感謝大家的幫助。非常感謝！ – decbrad 2010-04-10 18:27:56

作爲第二選項，你可能想嘗試overflow: scroll;或overflow-x和overflow-y有一個滾動條出現在div的情況下，內容不適合。

來源

2010-04-10 14:52:20 themoondothshine

至於提到的問題是，你定義一個固定的高度..等瀏覽器堅持吧..

你需要使它更加靈活的使用min-height財產。然而，IE不支持它，但由於另一個關於它如何處理高度的問題（如果它超出了定義的高度，它會擴展以滿足內容的需求），它可以被解決。

完整的解決方案是

height:auto!important; /*this set the height to auto for those supporting it (not IE)*/ 
height:500px; /*for IE, all others override it by the previous rule*/ 
min-height:500px; /*for the ones that support it (all but IE)*/

此，在一般情況下，是解決此類問題..你的情況，我看你使用絕對定位..如果你真的需要這一點，它不只是一個解決你的問題的嘗試，然後不幸的是，元素無法調整其大小以適應絕對定位元素。

來源

2010-04-10 14:56:33

個人觀點：爲了解決IE6的最小高度問題，最好在您的目標中使用特定於IE6的條件註釋，而不是將黑客添加到您的CSS中。

這是因爲遵循符合標準的CSS對您而言很重要，儘管這些日子裏tbh越來越困難，這得益於不可靠的瀏覽器支持。

<!--[if IE 6]> 
#MainContent, #MainImage, #ContentPanel { height:500px; } 
<![endif]-->

來源

2010-04-10 15:30:42 hollsk

添加更多文本時CSS DIV不擴展

回答

相關問題