Varför är DIVarna bredvid varandra i IE men ej FF?

Hej,

Jag vill lägga tre DIVs bredvid varan'n. Dessa tre ska vara i en DIV, som i sin tur ligger bredvid en DIV (som en border). Dessa "yttersta" två ligger i en DIV. Problemet är att i FF så lägger sig DIV "container" nedanför "bdrLeft" och ej bredvid, vilket funkar i IE. Skumt - det brukar ju funka i FF, så antagligen tänker jag fel någonstans...

En del av min kod är:

<div id="container1">
  <div id="bdrLeft" class="column">&nbsp;</div>
  <div id="container" class="column">
    <div id="header">
      <div id="header1">XXX</div>
      <div id="header2">YYY</div>
      <div id="header3">999 99 99<br>
      xxxxxxxx</div>
    </div>
  </div> 
  </div>

CSS till den är (har tagit bort det av ej betydelse, som tex typsnitt):

#container1 {
   width: 80%;
   margin: 10px auto;
}
#bdrLeft {
   float:left;
   width:20px;
   background-image:url(../images/bdrLineLeft.jpg);
   overflow:hidden;
}
#container {
   float:left;
   border-right: 2px solid #666666;
   background-image:url(../images/bkg_FFFFDF.jpg);
   text-align: left;
}
#header {
   padding: 30px 10px 50px 20px;
}
#header1 {
   float:left;
}
#header2 {
   float:left;
   padding-left:20px;
}
#header3 {
   float:right;
   padding-left:20px;
   text-align:right;
}

Har testat att lägga in height men det funkade inte.

Det blir rätt när jag lägger in en width för #container. Men det vill jag inte ha för jag vill att bredden på den ska fylla ut resten i #container1 (som är 80%), vari #bdrLeft (width 20px) och #container ligger.

Hur fixar jag det?

Mycket tacksam för svar.