[css-d] simple css question

[Francesco (Sin City Creative)]

I was trying to help a friend with a layout and ran into something.  The
page is XHTML 1.0 Strict, btw.  He wants a 40px tall header with two cells,
50% each.  Sounds simple, and it works as expected in FF 2.0, with two cells
side-by-side.  In IE 7, the right cell drops under the left cell, instead of
staying next to it.  Below is the CSS and relevant html.  Does 50% x 2 not
equal 100% in IE 7?

body {
  border: 0;
  margin: 0;
  padding: 0;
  color: #000;
  background: #FFF;
}

#container {
  width: 100%;
  margin: 0 auto;
}

#headerLeft, #headerRight {
  height: 40px;
  width: 50%;
}

#headerLeft {
  float: left;
  background: #F00;
}

#headerRight {
  float: right;
  background: #0F0;
}

<div id="container">
  <div id="header">
    <div id="headerLeft"></div>
    <div id="headerRight"></div>
  </div>
</div>
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/