css - 为 div 容器强制清除流

Question

我在我的 test page 上使用此代码清除 header 容器 float ，但不起作用。我能以某种方式强制它吗？

#header-container{
  position: relative !important;
  clear: both !important;
  overflow: auto !important;
}

Answer 1

使用这种方法:

#header-container:after {
  content: ' ';
  line-height: 0;
  display: block;
  clear: both;
  *zoom: 1;       /* trigger hasLayout for IE 6/7*/
}

我还建议看看才华横溢的 Nicolas Gallagher Micro clearfix

更新:

根据 OP 的解释，(在下面的评论中):

That header-container floats on top and stays there when i scroll and i don't want that.

这不是一个清除修复问题，#header-container 的子项都不是 float 的。

重点是 .viewitem-panel 和 .viewitem-inner 元素定位留在页面底部，对在标题下，.viewitem-inner 有一个 overflow-y: scroll; CSS 声明来滚动内容。

因此，除非更改布局，否则无法解决此问题。