html - 清除 float

Question

最近我一直在使用 <div style="clear:both;"></div>在每个 div 之后元素与 float: left/right属性。

现在我正在进行新闻系统的循环，并希望将一些元素 float 到右侧。

问题是:使用 clear: both; 是一个好的做法吗？每个 float 之后的属性？如果我不应该使用它，是否有任何好的替代品？

我当前的新闻 HTML 如下所示:

<div id="news">
     <div class="date" style="float: right;">06-05-2013</div>
     <div style="clear:both;"></div>

     <div class="text">[...]</div>

     <div id="comment-block" style="float: right;">Comment on this news</div>
     <div style="clear:both;"></div>
</div>

Answer 1

在我看来更好的解决方案是

HTML:

<div id="news">
    <div class="group">
        <div class="date" style="float: right;">06-05-2013</div>
    </div>
    <div class="text">[...]</div>
    <div class="group">
        <div id="comment-block" style="float: right;">Comment on this news</div>
    </div>
</div>

SCSS:

.group {
    &:before, &:after {
        content:"";
        display: table;
    }
    &:after {
        clear: both;
    }
    .lt_ie8 & {
        zoom: 1;
    }
}