Foros del Web » Creando para Internet » CSS »

como igualar altura de dos div dentro de uno contenedor?

Estas en el tema de como igualar altura de dos div dentro de uno contenedor? en el foro de CSS en Foros del Web. Buenos dias a toda la comunidad!! estoy intentando trabajar usando divs en vez de tablas, pero estoy intentando simular una tabla ( con div ) ...
  #1 (permalink)  
Antiguo 15/09/2010, 08:56
 
Fecha de Ingreso: enero-2010
Mensajes: 1
Antigüedad: 7 años, 11 meses
Puntos: 0
Pregunta como igualar altura de dos div dentro de uno contenedor?

Buenos dias a toda la comunidad!!



estoy intentando trabajar usando divs en vez de tablas,
pero estoy intentando simular una tabla ( con div ) de una fila y dos columnas, de tal manera que al aumentar en contenido de la columna nro 2 este no salte a la columna (div) 1.

No se cual sera la propiedad css q debo usar en este caso, anexo el codigo correspondiente

<div id="contenedor">
<!--primera fila-->
<div style="height:25px;float:left;width:100%;">
<strong>Titulo general</strong>
</div><!--Fin primera fila-->

<div style="height:100%;"><!--segunda fila-->
<div style="float:left; width:20%; height:100%; padding: 2px; text-align:center;" >
Fecha Hora
</div>

<div style="width:*; height:100px; padding: 2px; text-align:justify; overflow:auto;"> tenemos que seguir adelante por el equipo, por la fanaticada, pero sobre todo porque no los merecemos, demostremos que los GLORIOSOS somos nosotros y no el caracas que se quieren anotar, porque ese fue un legado que nos dej&oacute; el gran Musi&uacute; y tiburones pa&acute;encima
</div>
</div><!--Fin segunda fila-->

</div><!--Fin contenedor-->

Gracias de antemano por su valiosa ayuda!
  #2 (permalink)  
Antiguo 15/09/2010, 09:00
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 9 años, 5 meses
Puntos: 1010
Respuesta: como igualar altura de dos div dentro de uno contenedor?

usa la propiedad display:inline
__________________
if(ViolenciaDeGénero) {alert('MUJER ASESINADA');}
  #3 (permalink)  
Antiguo 15/09/2010, 11:02
 
Fecha de Ingreso: septiembre-2010
Mensajes: 8
Antigüedad: 7 años, 2 meses
Puntos: 0
Respuesta: como igualar altura de dos div dentro de uno contenedor?

Otra propiedad que puedes usar si lo que quieres es imitar una tabla es por ejemplo
"display: table-cell" hace que se muestre como si fuera una celda de una tabla
  #4 (permalink)  
Antiguo 15/09/2010, 16:24
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: como igualar altura de dos div dentro de uno contenedor?

Hola:

Código HTML:
Ver original
  1. <div id="contenedor">
  2. <!--primera fila-->
  3. <div style="height:25px;float:left;width:100%;">
  4. <strong>Titulo general</strong>
  5. </div><!--Fin primera fila-->
  6.  
  7. <div style="height:100%;"><!--segunda  fila-->
  8. <div style="float:left; width:20%; height:100%; padding: 2px; text-align:center;" >
  9.  Fecha Hora
  10. </div>
  11.  
  12. <div style="width:*; height:100px; padding: 2px; text-align:justify; overflow:auto;"> tenemos que seguir adelante por el equipo, por la fanaticada, pero sobre todo porque no los merecemos, demostremos que los GLORIOSOS somos nosotros y no el caracas que se quieren anotar, porque ese fue un legado que nos dej&oacute; el gran Musi&uacute; y tiburones pa&acute;encima
  13. </div>
  14. </div><!--Fin segunda  fila-->
  15.  
  16. </div><!--Fin contenedor-->

Revisando tu código he encontrado un par de cosas:

1º ¿Qué significa width:*?

2º Si el primer div tiene un ancho del 20% el otro (que tu pones como width:*) debería ser el 80% ¿no?

Ahí surge otro problema el 20% del primero y el 80% del segundo suman el 100%, pero tenemos un padding de 2px en cada uno de ellos ¿consecuencia? sobrepasamos el ancho del contenedor y el segundo div se mueve hacia abajo.

Solución al primer div, por ejemplo le ponemos un ancho del 19%. Y queda cada div en su sitio.

¿Tu problema está solucionado? NO, busca información sobre columnas equilibradas y ya puedes solucionarlo.

Saludos.


Etiquetas: posicionamiento
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

SíEste tema le ha gustado a 1 personas




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