Estou tentando criar uma tabela com apenas duas linhas. Minha intenção é que a tabela seja responsiva e que barra de rolagem apareça apenas na segunda linha caso o conteúdo ultrapasse a height. No Chrome funciona perfeitamente mais no FireFox não está funcionando.

HTML:

<table border=1>         <tr>             <td height="100">                 <h2>Cabeçalho</h2>             </td>         </tr>         <tr>             <td>                 <div class="conteudo">                     <p>Olá Mundo</p><br>                     <p>Olá Mundo</p><br>                     <p>Olá Mundo</p><br>                     <p>Olá Mundo</p><br>                     <p>Olá Mundo</p><br>                     <p>Olá Mundo</p><br>                     <p>Olá Mundo</p><br>                     <p>Olá Mundo</p><br>                     <p>Olá Mundo</p><br>                     <p>Olá Mundo</p><br>                     <p>Olá Mundo</p><br>                     <p>Olá Mundo</p><br>                     <p>Olá Mundo</p><br>                     <p>Olá Mundo</p><br>                 </div>             </td>         </tr>     </table> 

CSS:

html, body {     margin:0;     padding:0;     height:100%; }  .conteudo{     width:100%;     height:100%;     min-height:100%;     background-color:#999;     overflow: auto;     color: #fff; }  table {     width:100%;     height:100%;     min-height:100%; } 

Alguém me daria uma mãozinha??