html - 清除某个div下的所有元素

Question

我正在处理新闻提要，我遇到了以下问题:我想清除头像下面的所有元素，所以下面没有换行的文字或任何东西。

此图显示了问题:

我希望它是这样的(用 Photoshop 制作):

代码:

.news .news-item .avatar {
  background-image: url("https://dl.dropboxusercontent.com/u/35853519/zakzek.png");
  width: 55px;
  height: 55px;
  background-size: cover;
  float: right;
  margin-left: 15px;
  display: block;
}

JSFiddle(查看全屏以获得更好的 View ): http://jsfiddle.net/shadeed9/6npjgt7y/8/

谢谢，

Answer 1

如果是处理 float ，那么overflow:hidden;规则就可以了。

它显示 float 元素在文档流中的位置比在文档流中的位置更靠前。

http://jsfiddle.net/6npjgt7y/14/

.meta {
    overflow:hidden;
}

这是关于布局的:)触发它也是如此:display:table/inline-block/flex 和 float 也是如此。