IE versteckt float-Elemente

[Manu]

Guten Abend zusammen,

ich habe ein merkwürdiges Problem. Für ein fremdes Projekt wollte ich Code aufräumen und habe das css für einen kleinen Teil der Seite neu gemacht - jetzt 'versteckt' der IE allerdings gefloatete Elemente (in diesem Bsp. boxPage) hinter der...Hintergrundfarbe (in diesem Falle #CCCCCC). Was ist denn hier los?

<div class="details">
 <div class="boxes">
  <div class="boxPage">
   <h2>Diese Seite</h2>
   <div class="list">
    {foreach from=$LIST item=goto key=key}
    <a href="{$goto.link}">{$goto.title}</a><br />
    {/foreach}
   </div>
  </div>
  <div class="boxService">
   <h2>Service</h2>
   <div class="list">
    {foreach from=$SERVICE item=LINK}
    <a href="{$LINK.url}">{$LINK.title}</a><br />
    {/foreach}
   </div>
  </div>
  <br class="clearBoth" />
 </div>
</div>

div.details {
 background-color: #CCCCCC;
 padding: 4px 7px;
}

br.clearBoth {
 clear:both;
}

div.boxPage {
 float:left;
 width:150px;
}
div.boxService {
 float:right;
 width:400px;
 margin-left:20px;
}

Hat jemand eine Idee, wie ich das Problem mit Divs löse, ohne bspw. den DocType zu verändern (wüßte nicht, was das für Auswirkungen haben könnte...)

Gruß,
Manu