html - Clearing the floats -

recently have been using <div style="clear:both;"></div> after each div element float: left/right attribute.

now i'm in progress loop news system , want elements floated right side.

the question is: practise use clear: both; attribute after each float(s)? there nice replacement in case if shouldnt use that?

my current html news looks this:

<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 news</div>      <div style="clear:both;"></div> </div> 

in opinion better solution is

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 news</div>     </div> </div> 

scss:

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