Capa contenedora no se ajusta (Auto)

Buenas, tengo una capa contenedora y dentro dos divs, resulta que si a una capa contenida, le doy un height:auto, no se ajusta en Firefox, en IE 6 si.

CSS

Código :

#contenedor{
   width:700px;
   height:425px;
   margin:0 auto 0 auto;
   text-align:left;
   background-color:#FF6633;
}
#contenido1{
   position:relative;
   float:left;
   text-align:left;
   padding:4px;
   width:300px;
   height: auto;
   margin-left:15px;
   background-color:#99FF33;
   border-top: 2px solid  #FF0000;
}
#contenido2{
   border-left:2px solid; color:#666666;
   border-top: 2px solid  #FF0000;
   float:right;
   width:300px;
   height:225px;
   background-color:#FF99FF;
   margin-right:15px;
}

El html sería

Código :

<div id="contenedor">
   <div id="contenido1">Aquí iria el texto extenso que pese a que la contenedora tenga height:auto, no lo hace.</div>
   <div id="contenido2">más texto</div
</div>

Cómo debería de quedar?
Pon un screenshot de cómo debería, y de cómo queda.
Gracias.