Question

在我制作的网站上，我有这样的文字：

<textarea maxlength="1240" rows="20" cols="60" name="sub" style="color: #a7c1c5; background: black;"></textarea>

仅在Firefox上，此textarea有一个可见的62列而不是60列。这会导致我的网站出现问题，因为我需要文本完全适合textarea。这会导致Chrome或Opera等其他浏览器显示错误的文本。如何在所有浏览器上强制textarea为60列？

奇怪的是，行不受影响。

我也有一些CSS修改填充，但问题仍然存在。

Here is a jsfiddle demoing the issue, error only happens in Firefox

Answer 1

可悲的是，这个firefox bug已经有一段时间了，你必须检测用户代理并通过JS调整cols值。

if (navigator.userAgent.toLowerCase().indexOf('firefox') > -1) {
   document.querySelector('#myTextarea').cols = '58';
}

<textarea id="myTextarea" placeholder="wwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwAs you can see, this is 62 w's instead of 60" maxlength="1240" rows="20" cols="60" name="sub" style="color: #a7c1c5; background: black;"></textarea>

Firefox textarea列与属性值不同

1 个答案: