Hola a todos,
Ha pasado mucho tiempo, pero aún sigo en mis trece, creo que el problema no está totalmente solucionado, pero antes que anda quiero aclarar algunas cosas.
No estoy defendiendo el uso de tablas frente a una maquetación con capas y css, creo que está totalmente demostrados los beneficios del css, en cuanto accesibilidad, velocidad de carga y demás.
De echo, más pronto que tarde todos vamos a tener que optar por esta opción.
El tema es que después de tantos años utilizando tablas a mucha gente como a mi nos resulta engorroso utilizar css, porque no conseguimos hacer cosas que para nosotros antes eran muy sencillas, como la que hemos planteado.
La mayoría de mis clientes tienen webs pequeñas de tipo corporativo, o de tamaño medio. Por supuesto ellos no entienden la diferencia entre tablas o capas, y les importa más bien poco. Lo que sí les importa es el precio final del proyecto.
Por tanto si quieres ser competitivo en este mercado tienes que proporcionar webs a bajo coste aunque la calidad no sea del todo buena (es decir no cumples con los standares de accesibilidad).
Si me pongo a maquetar con capas te aseguro que no voy a tardar lo mismo en maquetar una web, que si lo hago con tablas, y por tanto el precio y mis dolores de cabeza van a aumentar significativamente.
Pero bueno, que remedio hay que empezar a olvidarse de las tablas, y empezar poco a poco a meternos con las capas.
Para que entiendas el problema que yo planteo, te diré que tienes un fallo en tu último código, algo que a simple vista no ves, pero que se diferencia claramente del comportamiento de una tabla.
El caso es que cuando consigas maquetar el sitio de forma correcta, para que se vea en todos los navegadores con cualquier resolución, etc... verás que tienes 20 mil excepciones para IE7 y para IE6, y al final no habrá sido rentable, porque el cliente no va a pagar por todas esas horas de trabajo.
Te adjunto tú código con una pequeña modificación, verás que el contenido se desborda.
Un saludo y gracias por tu esfuerzo.
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="es-es">
<head>
<title>Simulacion tabla</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
* { margin: 0px;
padding: 0px;
}
html, body { height: 100%;
width: 100%;
text-align: center;
}
#padre { border: none!important;
border: 1px solid rgb(204, 204, 204);
position: relative;
background-color: blue;
height: 100%!important;
height: 99.6%;
}
#uno { border-style: solid solid none!important;
border-color: rgb(204, 204, 204);
border-width: 1px;
border-bottom: 1px solid rgb(204, 204, 204);
background-color: red;
line-height: 3.2em;
height: 3.2em;
}
#padre > #centrado_v { border: 1px solid rgb(204, 204, 204);
text-align: center;
position: absolute;
top: 3.2em;
background-color: blue;
left: 0px;
right: 0px;
bottom: 0px;
}
span { position: relative;
top: 40%;
}
</style>
</head>
<body>
<div id="padre">
<div id="uno">Esta fila tendrá siempre 50px de
alto</div>
<div id="centrado_v"><span>Esta fila
ocupará el resto de alto<br><br><br><br><br><br><br>Esta fila
ocupará el resto de alto<br><br><br><br><br><br><br><br>Esta fila
ocupará el resto de alto<br><br><br><br><br><br><br>Esta fila
ocupará el resto de alto<br><br><br><br><br>Esta fila
ocupará el resto de alto</span></div>
</div>
</body>
</html>