Div no se expande incluso con contenido dentro

Tengo una pila de divs uno dentro del otro, todos los cuales tienen una identificación que especifica solo CSS.

Pero por alguna razón, la etiqueta DIV circundante solo se expande a su valor de altura ungido, y no a su valor automático predeterminado, lo que significa que aunque el contenido está dentro, el DIV de respaldo es solo una altura específica. Lo necesito para ajustar la altura al tamaño de lo que sea que esté dentro (ya que habrá datos enviados por el usuario que se repetirán posiblemente en párrafos con más de 500 palabras).

#albumhold {
  width: 920px;
  padding: 10px;
  height: auto;
  border: 1px solid #E1E1E1;
  margin-left: auto;
  margin-right: auto;
  background-color: #E1E1E1;
  background-image: url(../global-images/albumback.png);
  background-position: top center;
  background-repeat: repeat-x;
}

#albumpic {
  display: block;
  height: 110px;
  width: 110px;
  float: left;
  border: 1px solid #000;
}

#infohold {
  width: 800px;
  background-color: #CCC;
  float: right;
  height: 20px;
}

#albumhead {
  width: 800px;
  height: 20px;
  text-indent: 10px;
  border: 1px solid #000;
  color: #09F;
}

#albuminfo {
  margin-top: 5px;
  width: 800px;
  float: right;
  color: #09F;
  word-wrap: break-word;
}

<div id="albumhold">
  <div id="albumpic">Pic here</div>
  <div id="infohold">
    <div id="albumhead">Name | Date</div>
    <div id="albuminfo">Information</div>
  </div>
</div>

La ayuda es muy apreciada.

Los elementos flotantes no ocupan ningún espacio vertical en su elemento contenedor.

Todos tus elementos dentro #albumhold son flotantes, aparte de #albumheadque no parece que ocuparía mucho espacio.

Sin embargo, si agrega overflow: hidden; a #albumhold (o algún otro CSS para borrar flotadores dentro de él), ampliará su altura para abarcar a sus hijos flotantes.

Hay dos soluciones para solucionar esto:

1. Usar clear:both después de la última etiqueta flotante. Esto funciona bien.
2. Si tiene una altura fija para su div o el recorte de contenido está bien, vaya con: overflow: hidden

Probablemente necesite una solución clara.

Prueba esto:

¿Qué métodos de ‘clearfix’ puedo usar?

Agregar <br style="clear: both" /> después de que el último div flotante funcionó para mí.

Poniendo un <br clear="all" /> después de que el último div flotante funcionó mejor para mí. ¡Gracias a Brent Fiare y Paul Waite por la información de que los div flotantes no expandirán la altura del div principal! ¡Esto me ha estado volviendo loco! ;-}

Tiene una altura fija en .infohold, por lo que el div .albumhold solo sumará la altura de .infohold (20 px) + .albumpic (110 px) más cualquier relleno o margen que no haya incluido allí.

Intente eliminar la altura fija en .infohold y vea qué sucede.

No escribiste la etiqueta de cierre del div con id=”infohold.