粘性页脚 + 浮动元素答案

【问题标题】：Sticky footer + floating elements粘性页脚 + 浮动元素
【发布时间】：2011-11-02 16:49:18
【问题描述】：

关于粘性页脚 css 的另一个问题... 假设我有以下标记：

<div id="container">
    <div id="header">header</div>
    <div id="body">body</div>
    <div id="footer">footer</div>
</div>

正如您在fiddle 中看到的那样，使用给定的 css，粘性页脚就像一个魅力。
如果 div#body 只有很少的内容，它会停留在页面底部，当有很多内容时，它会在底部被推出屏幕。

我现在的问题是当我尝试在 div#body 中放置 2 个浮动 div（1 个左 - 1 个右）时。然后页脚在屏幕底部但内容很多时不下推（可以看this fiddle）

我怎样才能让它工作？我已经尝试了在网上找到的 1000 个技巧，但仍然无法理解如何使其发挥作用。

提前致谢。

【问题讨论】：

【解决方案1】：

试试：

#body {
   overflow:hidden;
}

编辑：这样你就不需要额外的元素来清除浮动了。

【讨论】：

【解决方案2】：

将<br style="clear:both;" /> 放在浮动 div 之后。

【讨论】：