css - CSS:输入标签外观不一致(Firefox和Safari)

我试图弄清楚为什么我的输入标签在Firefox和Safari中看起来很不平衡
看一下此屏幕截图：



我使用Firebug和Safari开发人员工具来了解发生了什么。
似乎Firefox在每个边框上又增加了1像素，这又导致了4像素
这会使输入看起来更大且烦人。加上文本看起来在Firefox中更高。是因为像素增加了吗？或者是其他东西？

无论如何，我很想知道为什么在Firefox中添加这些像素。

#signup-form form input[type="text"], input[type="password"] {
    height:20px;
    padding:2px 4px;
    width:300px;
    color:#a1a1a1;
    font-style:italic;
    display:block;
    margin:10px 0px 0px 0px
}

最佳答案

设置border-width: 2px;。元素在浏览器和操作系统之间的呈现方式有所不同，这只是Web开发人员必须忍受的。表单元素比其他元素更受此约束。

关于css - CSS:输入标签外观不一致(Firefox和Safari)，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/15053896/