清除:在块结束之前

Question

通常,我最终会做这样的事情:

<div class="one">
   <div class="floating-two">content</div>
   <div class="clear"></div>
</div>

我们通常的意思是,"确保任何浮动元素都包含在第一块中".可能是Sof,应用于"one"的任何背景都出现在所有内容之后,浮动或不浮动.

我正在寻找一种更清洁的方法来做到这一点.毕竟,"清晰"div只是我们打算应用于"一"的风格.我们可以这样做:

.floating-two:after{
  clear:both;
}

但这也不正确.浮动二不知道在"一"关闭之前是否可能有其他块跟随它.

有人为此开发了一个技巧吗？

Answer 1

您可以通过两种方式清除此操作而无需添加标记(没有<div class="clear"..>或等效):

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

要么

.one {
    overflow: hidden
}