修复mozilla firefox中的文本区域问题
修复mozilla firefox中的文本区域问题
提问于 2016-02-10 03:41:18
<form action="#" method="post" id="f">
<h3>Got a question? Post here for discussion!</h3>
<input type="text" name="title" placeholder="Write a Title..." size="82" required="required" />
<br/>
<textarea cols="83" rows="4" name="content" placeholder="Write description..." required="required"></textarea>
<br />
<input type="submit" name="sub" value="Post to Timeline" />
</form>
当我在Google Chrome中运行上面的代码时，文本区域的长度和输入的文本“type=”是一样的，但在mozilla firefox中，文本区域变得比正式文本要长。有什么帮助吗？
回答 3
Stack Overflow用户
发布于 2016-02-10 03:51:46
您是否尝试使用CSS而不是html来指定宽度和高度？
textarea {
width: 600px;
height: 100px;
}看看会不会有什么不同。如果需要，您可以更改像素。我刚选了一个很接近的。
Stack Overflow用户
发布于 2016-02-10 03:52:02
这是因为：
size和cols指定的是字符数，而不是长度。但是字符的宽度取决于字体，默认情况下input和textarea使用不同的字体。指定一种通用字体以防止this.textarea溢出，然后保留一些额外的空间以备需要滚动条时使用。使用overflow: hidden来防止这种情况。
input, textarea {
font-family: monospace;
overflow: hidden;
}<form action="#" method="post" id="f">
<h3>Got a question? Post here for discussion!</h3>
<input type="text" name="title" placeholder="Write a Title..." size="32" required="required" />
<br/>
<textarea cols="32" rows="4" name="content" placeholder="Write description..." required="required"></textarea>
<br />
<input type="submit" name="sub" value="Post to Timeline" />
</form>
也就是说，您可能更喜欢使用CSS width属性。
Stack Overflow用户
发布于 2016-02-10 03:52:15
不要使用cols和rows属性。使用CSS、width和height属性来确保跨浏览器的一致体验。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/35306414
复制相关文章
点击加载更多
相似问题
Mozilla firefox列修复
Mozilla Firefox中未更新的文本区域内容
javascript中的Mozilla firefox问题
javascript中的Mozilla firefox问题
Mozilla Firefox中的CSS/JS问题
添加站长 进交流群
领取专属 10元无门槛券
AI混元助手 在线答疑
关注 腾讯云开发者公众号
洞察 腾讯核心技术
剖析业界实践案例
腾讯云开发者
