Como esticar uma tabela HTML para 100% da altura da janela do navegador?

Question

Eu estou usando uma tabela para criar o layout de minha página web. Eu quero a tabela para preencher a página, mesmo que ele não contém muito conteúdo. Aqui está o CSS que estou usando:

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

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

E eu lugar algo como isto no código da página:

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

Isso funciona para Opera 9, mas não para Firefox 2 ou Internet Explorer 7. Existe uma maneira simples de fazer este trabalho solução para todos os navegadores populares?

(Adicionando id="container" para td não ajuda.)

Answer 1

Basta usar a propriedade height em vez da propriedade min-height ao definir #container. Depois que os dados fica muito grande, a tabela vai crescer automaticamente.

Answer 2

Tente usar o seguinte:

html, body    {
  height: 100%;
}

Assim, além de fazer a altura da tabela para 100%, você também deve ter a certeza de que o html'd e altura do corpo também são 100%, por isso vai esticar corretamente.