Clearfix导致Webkit显示错误

Question

我使用这个CSS：

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    font-size: 0
} 

将事物移到新线上。但是，在Webkit中，它会导致一堆内容消失，并将包含它的框移动到屏幕底部。这个技巧在IE和Firefox中正常工作。

我做错了什么，如何解决？

Answer 1

问题可能在您的代码中，我们无法看到。但尝试使用这个明确的修复。它每次都适合我：

.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

.clearfix {
    display: inline-block;
}

html[xmlns] .clearfix {
    display: block;
}

* html .clearfix {
    height: 1%;
}

http://www.webtoolkit.info/css-clearfix.html