Clear:both ali samo unutar diva?

[apash86]

#left {
float:left;
width:100px;
}

right {
float:right;
widht:100px;
}

#main {
margin-left:100px;
margin-right:100px;
}

.box {
float:left;
width:100px;
}

<div id="left">
</div>
<div id="right">
</div>
<div id="main">
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<br class="clear" />
<div class="box"></div>
<div class="box"></div>
</div>

imam levu kolonu, desnu i glavnu, a u glavnoj proizvoljan broj redova od po 3 box-a, koji su float-ovani levo, i sad pokusavam da namestim da sa <br class="clear" /> pređem u novi red i očistim float-ovana gornja 3 elementa, i da se tu ponovo ispišu 3 box-a i tako u krug.
tj to i radi kada se ispisuje samo u glavnom divu(#main), ali problem pravi leva strana koja je floatovana levo, i <br class="clear" /> "očisti" sve do ispod leve strane, i ostaje praznina između prvog i drugog reda elemenata u glavnom divu.
Da li postoji neki elegantan način da ovo rešim, tj da se clear:both odnosi samo na div u kome se nalazi(sto bi i bilo logično?)

ps. evo i slika, ako sam bio malo konfuzan