Limit width of child div to width of the parent div (IE8 quirks mode)

Question

I'm having trouble with a layout I'm trying to achieve. I have three divs on a page all with attribute float: left. Third div is dynamically filled, and shown or hidden, using jquery with content depending on what is hovered over in the second div. Third div has two child divs, of which the second div can potentially have many, many span elements. I want to limit the width of the third div to something like the 15% of the whole page, but those span elements never wrap around and just keep expanding on the same line. As mentioned in the title, I have to use IE in quirks mode. Is there any way to achieve this?

The html for the third div currently looks like this:

<DIV style="FILTER: ; ZOOM: 1; DISPLAY: none" id="infoDiv" name="infoDiv" jQuery1283154091152="89">
  <DIV class="ui-custom-state-requested">
    <SPAN style="DISPLAY: block; COLOR: white">foo bar</SPAN>
    <SPAN style="DISPLAY: block; COLOR: white"></SPAN>
    <SPAN style="DISPLAY: block; COLOR: white"></SPAN>
  </DIV>
  <DIV style="COLOR: white" class="siblingsDiv">
    <SPAN style="BORDER-BOTTOM: white 0.1em solid; BORDER-LEFT: white 0.1em solid; BORDER-TOP: white 0.1em solid; BORDER-RIGHT: white 0.1em solid" class="ui-custom-state-requested">6.8.2010.</SPAN>
    ...
    <SPAN style="BORDER-BOTTOM: white 0.1em solid; BORDER-LEFT: white 0.1em solid; BORDER-TOP: white 0.1em solid; BORDER-RIGHT: white 0.1em solid" class="ui-custom-state-requested">8.9.2010.</SPAN>
  </DIV>
</DIV>

CSS looks like this:

#infoDiv
{
    float: left;
    padding: 2em;
    width: 15%;
    max-width: 15%;
}