Tornar TBODY rolável nos navegadores Webkit
Estou ciente deessa questão, mas nenhuma das respostas funciona no Safari, no Chrome, etc.
A estratégia aceita (como demonstrado aqui) é definir as propriedades de altura e estouro do corpo assim:
<code><table> <thead> <tr><th>This is the header and doesn't scroll</th></tr> </thead> <tbody style="height:100px; overflow:auto;"> <tr><td>content that scrolls</td></tr> <tr><td>content that scrolls</td></tr> <tr><td>content that scrolls</td></tr> <tr><td>content that scrolls</td></tr> <tr><td>content that scrolls</td></tr> <tr><td>content that scrolls</td></tr> <tr><td>content that scrolls</td></tr> </tbody> </table> </code>
Infelizmente, isso não funciona em nenhum navegador de webkit. Existe umrelatório de erro sobre isso que não parece ser uma alta prioridade (relatado em 05 de junho).
Então, minha pergunta é: existem estratégias alternativas que realmente funcionam? Eu tentei a abordagem de duas tabelas, mas é impossível garantir que o cabeçalho se alinhará com o conteúdo. Eu só tenho que esperar pelo Webkit para consertá-lo?