无法使用CSS设置文本区域宽度

我尝试使用此CSS设置表单元素的宽度：

input[type="text"], textarea { width:250px; }

如果你看这个Firefox屏幕截图，你会发现这些字段的宽度不同。我在Safari中也得到了类似的效果

有什么解决办法吗

更新：谢谢你提供的信息。现在，我已经确保两个元素上的padding/margin/border设置相同。我仍然有这个问题。我发布的原始CSS被简化了。。。我还将文本区域的高度设置为200px。删除高度样式时，宽度匹配。奇怪的这毫无意义

---

浏览器错误？

也许您在浏览器中的某个地方定义了一个特定于用户的css覆盖，因为我刚刚测试了它，它按预期工作：

---

（在windows上测试。也许苹果原生小部件有一些怪癖？

试试border:0；或边框：1px实心#000

这可能是由于

和

元素上的默认边距不同造成的。试着用这样的东西

input[type="text"], textarea { 
    padding: 0;
    margin: 0;
    width:250px; 
}

---

尝试删除填充和边框。或者尝试使两个元素的值相同

input[type="text"],
textarea {
    width:250px;
    padding: 3px;
    border: none;
    }

或：

输入和文本区域元素通常有一些由浏览器应用的填充（因浏览器而异），这会使内容看起来比指定的宽度更宽

---

更新：也

框大小：边框框

是一种设置宽度的简便方法，填充和边框将占用宽度，而不是增加宽度。请参阅：

这个答案已经晚了三年，但我将它发布在这里，以防其他人试图在

em的
中设置宽度，而不是
像素
时遇到此帖子（就像我刚才做的那样）。确保字体大小相同

e、 g

否则，文本区域可能会有不同的大小（在FF12上为真）。
我也在努力解决这类问题，这个问题是我在谷歌搜索的第一个结果。最后对我起作用的是为文本区域设置
框大小：内容框
——Drupal 7默认为
边框框
，这会导致从文本区域的大小中减去填充和边框宽度。
设置宽度100%，然后使用最大宽度：

     textarea { 
          width:100%;
          max-width:250px;
     }

//删除了边距和填充，您可以根据需要添加边距和填充。
您可以使用：

input[type="text"], textarea { 
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

发布生成示例屏幕截图的HTML和CSS。您是否检查了元素周围的边距？祝您好运，在保留本地l&f的同时设计输入字段的样式。如果可能，将边框样式设置为可接受的样式。填充和边距不会增加宽度。这是目前最经得起未来考验的解决方案，也最不危险，而不是摆弄边距和填充。我们已经不再坚持浏览器了，是时候坚持标准并迫使浏览器供应商遵守了。总有一天会开始的。
     textarea { 
          width:100%;
          max-width:250px;
     }

input[type="text"], textarea { 
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}