Como fazer uma tabela, maior que o tamanho da tela, rolável e manter a linha do cabeçalho fixa?
Eu tenho ummesa com 2 colunas e cada coluna tem 800 px de largura. Quero mostrar esta tabela na janela 800x50. Portanto, deve haver barra de rolagem horizontal e vertical para visualizar a tabela completa.
Embora tenha encontrado poucas soluções relacionadas (esta eesta) no SO, eles só funcionam se a largura da tabela for menor que o tamanho da tela. No meu caso, o tamanho da tela é 1200 px e a largura total da tabela é 1600 px.
Como eu pude fazer isso? eu quero conseguir algo comoesta.
EDITAR Ops, esqueci de adicionar mais um requisito. Desculpa. Eu quero que o cabeçalho da tabela permaneça fixo enquanto o usuário rola a tabela.
EDIT2
Eu tentei as soluções mencionadas abaixo para quebrar em uma div, mas neste caso a barra de rolagem vertical não aparece. Por favor, vejaessa mesa com div de invólucro. Parece que esse problema ocorre apenas se a largura da tabela for maior que o tamanho da tela. Estou testando no FF3.6.
EDIT3
atualmesa código. Isso não tem rolador vertical, mesmo que eu possa rolar verticalmente.
<div style="overflow:scroll; width:800px;height:50px" >
<table style="width:1600px" border="1">
<thead>
<tr>
<th style="width:800px">id_1</th>
<th style="width:800px">id_1</th>
</tr>
</thead>
<tbody style="">
<tr><td>1200</td><td>1200</td></tr>
<tr><td>1200</td><td>1200</td></tr>
<tr><td>1200</td><td>1200</td></tr>
<tr><td>1200</td><td>1200</td></tr>
<tr><td>1200</td><td>1200</td></tr>
<tr><td>1200</td><td>1200</td></tr>
</tbody>
</table>
</div>