como igualar altura de dos div dentro de uno contenedor?

[hermesf]

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!

[IsaBelM]

usa la propiedad display:inline

[minvallado]

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

[jomaruro]

Hola:

Código HTML:

<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-->
 

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.