css - div的高度不随内容增加

Question

我的 div 的高度没有随着内容的增加而增加。

HTML:

<div style="position: relative;min-height: 200px;clear: both;margin: 25px 0;border:1px;solid black;width:500px;">
        <div style="float:left;">
            <label class="tab"> Review</label>

            <div class="tabcontent">
                 /* contents here */
                <div id="moviereviews">
                </div>
               </div>

        </div>

        <div style="float:left;">
            <label class="tab">Comments</label>

        </div>
</div>

CSS:

.tab
{
    background: #eee; 
    padding-left:5px;
    padding-right:5px;
    font-size:13px;
    line-height: 28px;
    padding-top: 5px;
    padding-bottom:5px;
    border: 1px solid #ccc; 
    margin-left: -1px; 
    position: relative;
    left: 1px;

}

.tabcontent {
  position: absolute;
  top: 28px;
  left: 0;
  background: white;
  right: 0;
  bottom: 0;
  border: 1px solid #ccc; 
}

我尝试将 overflow: hidden; 添加到主 div。但它并没有增加高度。在上面显示的代码之后我还有一个页脚 div:

<div class="footer"></div>

// CSS
.footer {
margin-top: 10px;
background: #ECE5B6;
float: left;
position: relative;
width: 100%;
z-index: 10;
height: 100px;
}

谁能帮我解决这个问题？

提前致谢。

Answer 1

感谢大家。我认为可能是其他一些 css 使我的代码无法根据您的代码工作。我通过将 overflow:hidden; 添加到

来解决它

<div style="position: relative;min-height: 200px;overflow: hidden;clear: both;margin: 25px 0;border:1px solid black;width:500px;">

和.tabcontent div.