Foros del Web » Creando para Internet » CSS »

Expandir div contenedor automáticamente

Estas en el tema de Expandir div contenedor automáticamente en el foro de CSS en Foros del Web. Hola gente, El problema parece sencillo pero me lleva de cabeza desde hace un buen rato. Os explico: Tengo un div contenedor (A) con dos ...
  #1 (permalink)  
Antiguo 14/05/2011, 11:11
 
Fecha de Ingreso: mayo-2011
Mensajes: 2
Antigüedad: 12 años, 11 meses
Puntos: 0
Expandir div contenedor automáticamente

Hola gente,
El problema parece sencillo pero me lleva de cabeza desde hace un buen rato. Os explico:
Tengo un div contenedor (A) con dos divs internos (B y C), dispuestos de la siguente manera:



Los divs B y C están configurados con float:left y float:right respectivamente.
El div C es un formulario que crece dinámicamente. Así pues, se puede dar el caso siguiente: El div C excede el height del contenedor y se "sale":



Estoy intentando de todas formas que, cuando se dé este caso, el div A de adapte al tamaño "extra" de C, de forma que se agrande y quede así:



Véis alguna solución posible?
Muchas gracias! :)
  #2 (permalink)  
Antiguo 14/05/2011, 15:52
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 15 años, 10 meses
Puntos: 1012
Respuesta: Expandir div contenedor automáticamente

en lugar de float, usa position: relative; y display: inline-block en ambos. el left de B será cero y de C es el resultado de ((width de B + width de C)-width de A)
  #3 (permalink)  
Antiguo 14/05/2011, 17:46
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 16 años, 10 meses
Puntos: 539
Respuesta: Expandir div contenedor automáticamente

Busque información sobre cómo "Limpiar float" o clearfix en cualquier buscador.
Son varias las técnicas (códigos) para ello. Cuál usar depende de su codificación (html+css) que desconocemos.

Por cierto, la última y mas semántica es obra de @necolas
  #4 (permalink)  
Antiguo 15/05/2011, 10:18
 
Fecha de Ingreso: mayo-2011
Mensajes: 2
Antigüedad: 12 años, 11 meses
Puntos: 0
Respuesta: Expandir div contenedor automáticamente

Gracias por la respuesta, no me acaba de funcionar del todo (se me descuadra el diseño), así que he pensado una solución más guarrilla, pero eficiente: Modificar el height del div A dinámicamente mediante javascript. :P
  #5 (permalink)  
Antiguo 15/05/2011, 10:24
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 21 años, 9 meses
Puntos: 361
Respuesta: Expandir div contenedor automáticamente

Hola:

Cita:
Iniciado por mauserc_96 Ver Mensaje
... así que he pensado una solución más guarrilla, pero eficiente: Modificar el height del div A dinámicamente mediante javascript. :P
Ya que te han dado la pista para solucionar el problema y, además, reconoces que la solución es más "guarrilla" ¿porqué rendirse tan pronto y no seguir buscando la solución "correcta"?

Saludos.

  #6 (permalink)  
Antiguo 15/05/2011, 12:02
Avatar de erickxls  
Fecha de Ingreso: julio-2009
Ubicación: Lima
Mensajes: 78
Antigüedad: 14 años, 9 meses
Puntos: 3
Respuesta: Expandir div contenedor automáticamente

crea un div luego de C pero dentro de A y no le des altura a A
Código HTML:
Ver original
  1. <div id="a">
  2. <div id="b"></div>
  3. <div id="c"></div>
  4. <div id="d"></div>
  5. </div>
Código CSS:
Ver original
  1. #d{
  2. clear: both;
  3. }

Última edición por erickxls; 15/05/2011 a las 12:12

Etiquetas: contenedor, expandir
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 09:12.