css - 容器 div 不扩展到内部 div 内容

Question

我整晚都在寻找，我必须做错事，因为我已经看到这个问题或类似的问题之前已经发布过。我很抱歉需要再次询问。

我有一个包含其他 div 的容器 div，它不会随内部 div 内容扩展。代码可以在这里找到：http: //jsfiddle.net/pR7bq/

我无法移除高度：100%；来自#container，因为它也需要容纳更少的内容。我已经看到提到使用

<br style="clear:both" />

但我要么使用不正确，要么无法正常工作。我在这里找到了对相同或类似问题的写得很好的答案：我可以使用哪些“clearfix”方法？，但是，我不知道将代码放在哪里。我最好的尝试都失败了。我也尝试过使用溢出属性，但我不希望滚动条出现在 div 而不是页面上，如果这有意义的话。

感谢所有帮助，并提前感谢您。

score 1 · Accepted Answer

将此用于您的容器样式：

#container{
    width:80%;
    background:#f6f6f6;
    height:auto;
    margin: 0 auto;
}

通过使用自动高度，浏览器尝试确定将覆盖其所有子元素的元素的高度。

当您使用 height: 100% 时，它根据元素容器的父高度确定高度。

score 1 · Accepted Answer

现在习惯了min-height不身高

像这样

#container{
height:100%; // remove this line
min-height:100%; // add this line 
}

score 0 · Accepted Answer

我通常只是在我的 css 中抛出一个这样的类

.iefix{ clear: both;font-size: 1px;}

然后我把它放在一个 div 下的 div 下，这些 div 在 IE 中没有表现

<div class="wrap">
    <div class="left">
    </div>
    <div class="right">
    </div>
    <div class="iefix"></div>
</div>

score 0 · Accepted Answer

0

使用高度自动或不定义高度来解决您的问题

于 2013-03-12T06:38:54.863 回答

4 回答 4