html - 文本区域溢出 :auto difference in height

Question

以下代码呈现一个文本区域，它应该有 3 个可见行:

<textarea id="txtInput" rows="3" cols="20" style="overflow:auto"></textarea>

但是，在 Firefox(版本 20.0.1)中，显示的是 4 行而不是 3 行。

另见 http://jsfiddle.net/KxXsS/

我该如何解决这个问题？

Answer 1

Firefox 在文本字段后添加了额外的行。您可以使用 CSS 解决此问题:

@-moz-document url-prefix() {
    textarea {
        height: 4em;
    }
}

@-moz... 是针对 mozilla 的特定规则，url-prefix 规则将规则应用于 URL 以它开头的任何页面。