不根据内容调整高度

Question

我似乎无法弄清楚为什么我的信息容器div不会根据其内容调整其高度.我确实有一个浮动div,我认为它可能导致问题,但我不完全确定.我有一个链接到jsfiddle,你可以看到CSS和一些HTML,如果它有帮助.任何帮助是极大的赞赏!

这是保存float的信息容器ID的CSS和所有其他信息

    #info-container{
    position:relative;
    padding-bottom:20px;
    padding-top:20px;
    padding-left:10px;
    padding-right:10px;
    margin-left:auto;
    margin-right:auto;
    background:#6F90A2;
    min-width:1000px;
    max-width:1000px;
    clear: both;
    height:auto;
}

http://jsfiddle.net/r35K4/

Answer 1

添加overflow:auto;到#info-container.

jsFiddle例子

浮动子元素会将其从文档流中移除,父级将折叠.通过添加溢出规则,可以恢复所需的行为.

Answer 2

#info-container{
    overflow: auto;
}