html - 继续扩展内容而不是将页脚向下推

Question

在下一页:http://www.mkleinwebdesign.com/optimarestore/faq/

当打开/展开多个问题时，它会将页脚向下推。有没有办法解决这个问题，使白​​色内容部分在顶部展开，而不会将页脚内容向下推？

HTML

div class="content left" style-"margin-right: 30px; min-height: 500px">

CSS

 .content {
    background: white;
    padding: 35px;
    margin-top: 30px;
    color: #767676;
    line-height: 22px;
    }

.left {
    float: left;
    width: 57%;
}

提前致谢!

Answer 1

一定要正确清除你的 float ，以防止内容从容器中溢出。具有 content 和 left 类的 div 向左浮动，但在页脚之前未清除 float 。这允许“转义”容器 div 的内容将页脚内容向下推。

问题，直观解释:http://css-tricks.com/the-how-and-why-of-clearing-floats/

我注意到您已经有了 CSS，可以通过使用类为 clearfix 的 div 来清除 float 。

<div class="clearfix"></div>

只需在页脚 div 之前添加它，它就会解决这个问题。

还有其他清除 float 的方法——有些甚至可以让您避免添加诸如空 div 之类的非语义 HTML 标记，但看起来这是该网站上已经在使用的方法，所以我建议坚持已有的东西。