em 错误解决方法中的 Mozilla 3.0.8 和 Chrome 高度

Question

我在 div 中有一个 textarea：

<div id="textareawrapper">
  <textarea id="chat"></textarea>
</div>

...和CSS：

#textareawrapper {
    border 1px dashed pink;
    margin:0;padding:0;
    position: absolute;bottom: 0em;left:7.5em;right:7.5em;height: 7em;
}
#textareawrapper textarea {margin:0;padding:0;width: 100%;height:7em;}

IE 7 渲染得很好：textarea 的高度等于包装 div 的高度。在 Mozilla 和 Chrome 中，包装 div 呈现 7em 高，但 textarea 有 20-25px 不够高，因此 textarea 的底部和 div 的底部边框之间存在间隙。有谁知道如何解决这个问题？

Answer 1

textarea默认使用不同的字体，所以大小不同（因为ems与文本大小有关）。

添加这个：

#textareawrapper textarea { font-size: 100%; font-family: inherit; }

在 FF3 中测试和工作