替换clear：都用伪类 [英] replace the clear:both with pseudo class

问题描述

以前，当我有浮动块，我会停止浮动，我用;

Previously, when I had floatings blocks, and i will stop the float, i used ;

<div style="clear:both"></div>

但现在，我使用伪类解决了这个问题：

But now, i'm solve this problem with pseudo class :

.last_floating_div:after {
 content: ""; 
 display: table;
 clear: both;
}

我一直工作得很好。但今天...它不工作...！
看看这个清晰的例子： http://jsfiddle.net/YsueS/2/

I has always works perfectly. But today... It doesn't work... ! Look at this clear example : http://jsfiddle.net/YsueS/2/

我知道我的问题是一个初学者的问题。我已经卖了这个问题这么多次...我真的不明白为什么它不工作在这里！

I know my problem is a total beginner problem. I have sold this problem so many times... I really don't understand why it doesn't work here !

非常感谢大家！

推荐答案

当然 - 你可以通过：清除它后： clearfix， ，轻量级的解决方案只是在父级上设置 overflow：hidden ，以更少的编码实现所需的效果。

Sure - you could clear it via an :after clearfix, however the most optimal, lightweight solution would just be to set overflow:hidden on the parent, achiving the desired effect with much less coding.

#mention {
    overflow: hidden;
}

jsFiddle此处

要直接回答问题，您应该应用：之后 clearfix到 #mentions - 父项，而不是子项.. jsFiddle here 。

To answer the question directly though, you should have applied the :after clearfix to #mentions - the parent, instead of the child.. jsFiddle here it works.

这篇关于替换clear：都用伪类的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！