Como fazer com que <div> preencha <td> a altura no Firefox
Por aqui, essa pergunta foi respondida no IE e no Chrome, mas a solução proposta parece não funcionar no Firefox 16, 45 e provavelmente em todas as versões intermediárias.
Basicamente, a solução proposta é a seguinte:
table,th,td {
border: 1px solid black;
}
<table>
<tr>
<td style="height:1px;">
<div style="border:1px solid red; height:100%;">
I want cell to be the full height
</div>
</td>
<td>
This cell
<br/>is higher
<br/>than the
<br/>first one
</td>
</tr>
</table>
Ao definir oheight
dotd
para1px
a criançadiv
pode definirheight:100%
. No Chrome e IE, o100%
é então interpretado como "a altura da célula", enquanto no Firefox parece se tornar a altura máxima necessária para odiv
s conteúdo.
A execução do exemplo acima no Firefox ilustrará isso intuitivamente ...
Então, estou procurando uma solução que também funcione no Firefox.