textarea的高度与Firefox中的行不匹配 [英] Height of textarea does not match the rows in Firefox

问题描述

textarea的行属性与Firefox中的行数不匹配。例如：

 < textarea rows = 4 cols = 40> 
 1 
 2 
 3 
 4 
这行在FF 
< / textarea>中是可见的。 
  

示例： http://jsfiddle.net/Z7zXs/6/

我该如何解决这个问题？ textarea应该只显示4行（而不是5） rows = 4 。

解决方案< Firefox总是在文本框之后添加一行。如果你希望它有一个不变的高度，可以使用CSS，例如：

  textarea {
 height：5em; 
} 
  

http://jsfiddle.net/Z7zXs/7/

编辑：
您也可以使用 @ - moz-document url-prefix CSS扩展，只针对Firefox浏览器。例子

  @  -  moz-document url-prefix（）{
 textarea {
 height：5em; 
} 
} 
  

The textarea's rows attribute does not match the number of lines in Firefox. For instance:

<textarea rows=4 cols=40>
1
2
3
4
this line is visible in FF
</textarea>

Example: http://jsfiddle.net/Z7zXs/6/

How can I fix this issue? The textarea should only display 4 lines (instead of 5) for rows=4.

解决方案

Firefox always adds an extra line after the textfield. If you want it to have a constant height, use CSS, e.g.:

textarea {
    height: 5em;
}

http://jsfiddle.net/Z7zXs/7/

EDIT: You can also use the @-moz-document url-prefix CSS extension to target only the Firefox browser. Example

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

这篇关于textarea的高度与Firefox中的行不匹配的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！