¿Cómo estirar una tabla HTML al 100% de la altura de la ventana del navegador?
-
01-07-2019 - |
Pregunta
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.¿Existe una forma sencilla de hacer que esta solución funcione para todos los navegadores populares?
(Agregando id="container"
a td
no ayuda.)
Solución
Sólo usa el height
propiedad en lugar de la min-height
propiedad al configurar #container
.Una vez que los datos sean demasiado grandes, la tabla crecerá automáticamente.
Otros consejos
Intenta usar esto:
html, body {
height: 100%;
}
Entonces, además de hacer que la altura de la tabla sea del 100%, también debes asegurarte de que el html y la altura del cuerpo también sean del 100%, para que se estire correctamente.