tablas - ¿Cómo estirar una tabla HTML al 100% de la altura de la ventana del navegador?

tablas en html5

Question

Estoy usando una tabla para diseñar el diseño de mi página web. Quiero que la tabla llene la página incluso si no contiene mucho contenido. Aquí está el CSS que estoy usando:

html, body {
    height: 100%;
    margin: 0;
    padding: 0; 
}

#container {
    min-height: 100%;
    width: 100%; 
}

Y coloco algo como esto en el código de la página:

<table id="container">
<tr>
<td>
...

Esto funciona para Opera 9, pero no para Firefox 2 o Internet Explorer 7. ¿Hay alguna manera simple de hacer que esta solución funcione para todos los navegadores populares?

(Agregar id="container" a td no ayuda.)

Answer 1

Simplemente use la propiedad height lugar de la propiedad min-height cuando configure #container . Una vez que los datos sean demasiado grandes, la tabla crecerá automáticamente.

Answer 2

Intenta usar esto:

html, body    {
  height: 100%;
}

Entonces, además de hacer que la altura de la mesa sea del 100%, también debes asegurarte de que la altura html''d y la del cuerpo también sean del 100%, por lo que se estirarán correctamente.