Problema con div contenedor

Hola,

Practicando un poco CSS he hecho algo muy sencillo: Un marco (div) que contiene a otro. Se me ha presentado un problema, en explorer se ve bien pero en firefox el marco contenedor me aparece como si no tuviera contenido y aun lado se ve el marco contenido.

Para que puedan ver el problema el link es: http://digit-services.com/problema/problema.htm

El html es:

Código :

<div class="marco_rojo">
  <div class="izquierdo">
    <p>Esta</p>
    <p>es una</p>
    <p>prueba</p>
  </div>

Y el css es:

Código :

.izquierdo {
   height: auto;
   width: 115px;
   float: left;
   position: relative;
   left: 0px;
   top: 0px;
   right: 0px;
   bottom: 0px;
   padding: 10px;
   background-color: #00FF00;
}

.marco_rojo {
   width: 776px;
   border: 2px solid #FF0000;
   height: auto;
   padding: 0px;
   margin: 0px;
   position: relative;
   background-color: #999999;

Espero que me puedan ayudar explicandome el error que tengo. Gracias.

A mi ya me había pasado algo parecido, el problema esta en el Float.

Solamente vas a tener que hacer un div "pie" y ya.

http://www.cristalab.com/foros/viewtopic.php?t=16588

Checalo

Debes limpiar el float con clear.

Agrega un div o algún otro elemento debajo del float y dentro del contenedor. Luego añadele el siguiente estilo css. Debe funcionar.

Código :

clear: both;

Suerte

eso que dijo the_neo_jp es como la seccion amarilla
yo tenia el mismo problema con unos divs del demonio pero lo soluciones con eso

Reymond, gracias por darma la referencia al otro post.
the_NEO_JP, perfecta la explicación. Asunto arreglado.

Estoy empezando con CSS y me estoy leyendo este libro: Professional CSS
Cascading Style Sheets for Web Design me ha parecido muy bueno y lo recomiendo.

CSS - McGraw Hill - CSS 2.0 Programmer's Reference, este sí que es bueno...

CSS Mastery, este SI es bueno.

no, el mio es mejor

y yo soy lo mejor...