标准化Internet Explorer中的textarea元素

在所有版本的Internet Explorer（包括版本11测试版）中，元素textarea比在任何其他浏览器中具有相同宽度的textarea低1px或2px。怎么解决？标准化Internet Explorer中的textarea元素

使用CSS Reset来规范化所有浏览器的行为。 – Raptor

如何做css重置？ – user2857661

CSS重置是沿线的东西：http://meyerweb.com/eric/tools/css/reset/ – martincarlin87

为了解决IE 11的布局问题（并且使所有浏览器的布局外观看起来都是99％），建议使用CSS Reset。

复制并粘贴到CSS重置脚本在http://cssreset.com

2013-10-08 08:10:52 Raptor

@ JukkaK.Korpela错误。 CSS Reset旨在解决这类问题，尤其是在非标准浏览器（如Internet Explorer系列）中的行为。 – Raptor

只看Chrome和IE，他们为一个无样式，否则设置textarea略有不同的默认height和margin性能。为了让跨浏览器的一致性，最好的办法是要明确所有像这样的盒子模型属性（随机选择的值，但你的想法）：

texarea { 
    width: 400px; 
    height: 100px; 
    padding: 0; 
    border: 1px solid #999; 
    margin: 0; 
}

希望这有助于。

2013-10-08 08:36:27

感谢您的替换，但...看到这个小提琴：IE中的http://jsfiddle.net/HXeTu/1是1px或2px更小（宽度）。 – user2857661

@ user2857661，你的小提琴没有设置“高度”，这是答案中的关键。宽度相同 - 请在提及尺寸时明确提及的内容。 –

看起来Chrome浏览器正在将宽度，填充等数据整理为整数值，但IE浏览器并非如此，而这正是来自1px或2px差异的地方。 –

在textarea元素上设置height，并在其上设置display: block（使height适用）。示例（你当然应该使用一个外部的样式表在现实生活中）：

<textarea rows=10 style= 
"display: block; height: 12em; line-height: 1.2; font-size: 90%; margin: 0">

使用height值等于行1.2em次数似乎工作确定。对于通常在textarea中使用的字体应该足够了。剩下的就是处理浏览器默认值的差异。

说明：如果您查看浏览器开发人员工具中的textarea元素，可以看到填充和边框值相同，但内容高度不同。原因在于textarea格式是特定于浏览器的，高度计算不仅基于字体大小，而且基于浏览器相关规则。浏览器让你覆盖这个。

您可以另外设置这些，因为它们对应于普通的浏览器默认设置，但有些浏览器可能会偏离一点（这通常是不相关的，但如果你的目标是在像素精确不妨事）：

textarea { padding: 2px; border-width: 1px; }

2013-10-08 09:05:38

在我的最后一个例子中是高度和显示块，结果是一样的...... – user2857661

@ user2857661，如果你的意思是这个解决方案没有帮助，请显示你尝试过的实际代码（一个独立的例子）并准确解释可以看到问题的地方。最好编辑你的问题，解决评论中提出的问题。 –

回答