Duda con CSS y tabla

[NeoZ]

Buenas noches a todos.
Estoy aprovechando y rediseñando una página que está maquetada con tablas, pero quiero pasar la mayor parte del diseño a CSS.

He estado leyendo en el foro como ocupar todo el espacio vertical de un navegador, utilizando CSS aplicado a tablas. (estoy normalizando el código html para W3C)

El problema es el siguiente:

Código:

html,body{
     height:100%;
     margin:0px;
}
#principal{
     height:100%;
}
#contenedor{
     height:100%;
}

<table id="principal" >
   <tr>
      <td>
         <table id="contenedor">
            <tr>
               <td></td>
            <tr>
         </table>
      <td>
   <tr>
</table>

La tabla contenedor le aplica el height:100% perfectamente, pero luego me gustaria aplicarle también un 100% a la tabla que está anidada en su interior. Pues no hay manera... He probado varias opciones, como darle un 100% de alto a la celda de la tabla principal, pero tampoco.

¿Se les ocurre algo mas?
Gracias y saludos!!!

[Rafael]

Supongo que es un codigo abreviado, ya que no tiene mucho sentido asi tablas vacias dentro de tablas vacias.

Pueden ser muchas cosas, como que colapsen las celdas al estar vacias.

[NeoZ]

Hola Rafael.

Muchas gracias por la respuesta, pero al final lo logré.
Lo resolví colocando esto en el código CSS:

Código:

html,body{
     height:100%;
     margin:0px;
}
#principal{
     height:100%;
}
#contenedor{
     height:90%;
     width:100%;
     position:relative;
     top:auto;
     left:auto;
}

En el código anterior no coloqué nada entre la <td> de la tabla anidada para simplificar el ejemplo, pero realmente si que tiene contenido.

Funciona correctamente con Firefox y IE.

Saludos!!!