Javascript 为什么文本输入有额外的填充？

我正在尝试在

上覆盖文本（用于跨浏览器

占位符

支持）。我发现我的定位总是偏离了几个像素，因为某种填充无法通过设置

padding:0移除。这些建议并不能解决问题

您可以在以下Chrome屏幕截图中看到此填充，即蓝色高光和黄色边框之间的空白：


我如何才能a）删除此空间；或者b）使用Javascript进行测量？
您需要重置所有内容。因此，建议最好使用：

<style>
html, body {

  margin: 0;
  padding: 0;

}
</style>


html，正文{
保证金：0；
填充：0；
}

希望这能有所帮助。
如果您用自己的边框替换默认边框，填充就会消失（至少对我来说，在Chrome/Mac上）：


这是我使用的CSS：

input {
    padding: 0;
    outline: none;
    border: 1px solid red;
}

 
你尝试过CSS重置吗？你应该考虑使用一些东西，比如如果你不想处理一个完整的CSS重置（在几乎所有的情况下都是不必要的）。这对我来说是Chrome 27.0.1547.57。原因是Chrome默认为一个2px的插入边框，它看起来像一个单像素的实体边框，还有一个额外的像素间距！这适用于最新版本的Chrome、Firefox（一开始还行）、Safari以及IE8和IE9，但不适用于Opera和IE10。知道为什么吗？@1''你也重置了边距吗？你试过设置边框框模型吗？我的JSFIDLE在Opera 15/Mac中看起来不错。我现在不能测试IE@1“是的，很好，我只是忘了在所有这些之后将填充重置为0。再次感谢！这是行不通的，尽管它通常是解决此类问题的好方法。