Foros del Web » Creando para Internet » CSS »

div sin height con contenido dinámico

Estas en el tema de div sin height con contenido dinámico en el foro de CSS en Foros del Web. Hola, tengo el siguiente problema. Tengo un div que se genera dinámicamente, al que le asigno una clase para que tenga estilos. Este div contiene ...
  #1 (permalink)  
Antiguo 17/03/2009, 06:14
 
Fecha de Ingreso: noviembre-2007
Ubicación: Madrid
Mensajes: 96
Antigüedad: 10 años
Puntos: 2
div sin height con contenido dinámico

Hola,

tengo el siguiente problema. Tengo un div que se genera dinámicamente, al que le asigno una clase para que tenga estilos.
Este div contiene algún título y texto que leo de la base de datos. Como estos datos pueden ser diferentes, el ancho del div puede variar, por eso no le pongo ancho en los estilos. Lo que genera en cada registro es mas o menos esto:

Código PHP:
$salida "<div class='estilo'>".
"<ul>".
"<li>".$row['nombre']."</li>".
"<li>".$row['fecha']."</li>".
"<li>".$row['comentario']."</li>".
"</ul>".
"</div>"
Y en la clase estilo tengo

Código:
.estilo{
width:300px;
background:url(images/02934.gif) no repeat bottom;
margin-bottom:5px;
}
Mas o menos, lo he hecho de cabeza porque donde estoy no tengo acceso al código.
El caso es que en IE me funciona, pero en firefox, el primer div que me genera me lo muestra sin height, si acaso de ancho 5px por el margin-bottom, y el resto de divs los hace con tamaño (no se si es el que le corresponde), y el último se queda fuera, osea todo descuadrado, como si no estuviera el contenido dentro del div.

¿Alguien sabe porqué pasa eso y como solucionarlo?

Gracias y saludos.
  #2 (permalink)  
Antiguo 17/03/2009, 08:44
Avatar de willyfc  
Fecha de Ingreso: octubre-2008
Ubicación: Santa Cruz - Bolivia
Mensajes: 662
Antigüedad: 9 años, 2 meses
Puntos: 40
Respuesta: div sin height con contenido dinámico

dices que no le pones un ancho, pero el estilo tiene un ancho de 300px, entonces creo que te confundiste. Bueno haber prueba con eso:

Código HTML:
.estilo{
width:300px;
height: auto;
overflow:auto;
background:url(images/02934.gif) no repeat bottom;
margin-bottom:5px;
}
__________________
WFC
codigo82
  #3 (permalink)  
Antiguo 17/03/2009, 09:06
 
Fecha de Ingreso: noviembre-2007
Ubicación: Madrid
Mensajes: 96
Antigüedad: 10 años
Puntos: 2
Respuesta: div sin height con contenido dinámico

Gracias willyfc por tu respuesta.
Perdón, al decir ancho quise decir height, como en lo que hay es mas estrecho el height que el width le llamé ancho al height sin querer.
Creo que el 'height:auto' puede ser lo que esté buscando, lo probare. Pueden ver el resultado aquí, pero solo me ocurre en firefox, en explorer me funciona bien.
Le puse un color de fondo al div para que se vea mejor.
  #4 (permalink)  
Antiguo 17/03/2009, 09:17
Avatar de willyfc  
Fecha de Ingreso: octubre-2008
Ubicación: Santa Cruz - Bolivia
Mensajes: 662
Antigüedad: 9 años, 2 meses
Puntos: 40
Respuesta: div sin height con contenido dinámico

bueno ahora ya entendí lo que quieres hacer, pero haz dado estilo a las listas?
__________________
WFC
codigo82
  #5 (permalink)  
Antiguo 17/03/2009, 09:19
 
Fecha de Ingreso: noviembre-2007
Ubicación: Madrid
Mensajes: 96
Antigüedad: 10 años
Puntos: 2
Respuesta: div sin height con contenido dinámico

A las listas le di estilos de flotado y anchura (width)
  #6 (permalink)  
Antiguo 17/03/2009, 10:04
Avatar de willyfc  
Fecha de Ingreso: octubre-2008
Ubicación: Santa Cruz - Bolivia
Mensajes: 662
Antigüedad: 9 años, 2 meses
Puntos: 40
Respuesta: div sin height con contenido dinámico

es necesario que imprimas de esa manera?, o sea me refiero a que el div este dentro de la variable salida
__________________
WFC
codigo82
  #7 (permalink)  
Antiguo 17/03/2009, 10:41
 
Fecha de Ingreso: noviembre-2007
Ubicación: Madrid
Mensajes: 96
Antigüedad: 10 años
Puntos: 2
Respuesta: div sin height con contenido dinámico

Si porque cada comentario lo quiero separar de los demás, se que podría usar solo listas, pero bueno, ese no es problema. Ya lo solucioné, no se si voy a saber explicarlo. Tengo una clase 'flotado' en la que hago un 'clear:both'. Entonces, en el siguiente div se perdía el float:left.
Lo he solucionado poniendo float:left en la clase 'estilo' del div y poniendo un ancho al div de 100%.
Así me funciona
gracias por tu ayuda.
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 16:53.