添加更多文本时,CSS DIV不会扩展

Question

我有一个快速的CSS问题,我希望有人可以帮助我!

我有一个名为#ContentPanel的DIV,我希望它能够扩展,以便在需要时可以提供更多文本.目前,如果文本长度超过500px(在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

Answer 1

用min-height而不是height.

除了IE 6:它有一个bug,所以它解释height为min-height.

Answer 2

你需要使用min-heightcss 属性