Foros del Web » Creando para Internet » CSS »

div float:left

Estas en el tema de div float:left en el foro de CSS en Foros del Web. hola tengo un problema lo que pasa es que tengo unos div la cual son float:left; y son dinámicos y se escapan del contenedor @import ...
  #1 (permalink)  
Antiguo 05/02/2013, 11:39
Avatar de aldairlinux  
Fecha de Ingreso: mayo-2011
Mensajes: 21
Antigüedad: 12 años, 10 meses
Puntos: 0
div float:left

hola tengo un problema lo que pasa es que tengo unos div la cual son float:left;
y son dinámicos y se escapan del contenedor

Código CSS:
Ver original
  1. #n1{
  2. float:left;
  3. height:50px;
  4. width:100px;
  5. }
  6. #n2{
  7. float:left;
  8. height:50px;
  9. width:100px;
  10.  
  11. }
  12. #n3{
  13. float:left;
  14. height:50px;
  15. width:100px;
  16.  
  17. }
  18. #contenedor{
  19. width:200px;
  20. height:auto;
  21. }
Código HTML:
Ver original
  1. <div id="contenedor">
  2. <div id="n1"></div>
  3. <div id="n2"></div>
  4. </div>

Al momento de agregar el div n3 el div contenedor no baja, el div n3 sale por fuera del contenedor !
como ago para que el contenedor se ruede con el div n3 ?

Código HTML:
Ver original
  1. <div id="contenedor">
  2. <div id="n1"></div>
  3. <div id="n2"></div>
  4. <div id="n3"></div>
  5. </div>
  #2 (permalink)  
Antiguo 05/02/2013, 11:42
Avatar de ipraetoriux  
Fecha de Ingreso: abril-2010
Ubicación: ipraetoriux.com
Mensajes: 1.125
Antigüedad: 13 años, 11 meses
Puntos: 154
Respuesta: div float:left

debes agregarle position relative a las capas
  #3 (permalink)  
Antiguo 05/02/2013, 11:44
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.488
Antigüedad: 21 años, 7 meses
Puntos: 2114
Respuesta: div float:left

Al tener elementos flotados no puede crecer. La solución mas limpia pasa por aplicar overflow al div#contenedor.

Código CSS:
Ver original
  1. #contenedor{
  2.   width: 200px;
  3.   overflow: hidden;
  4. }

Comúnmente conocido como clearfix. Así vamos pisoteando el idioma.

La altura automática se la puedes quitar.

Etiquetas: contenedor
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 01:17.