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á Mundo1</p><br>
</div>
</td>
</tr>
</table>
CSS:
html, body {
margin:0;
padding:0;
height:100%;
}
.conteudo{
width: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??