在Chrome用户代理样式表中，2px = 0em如何？

Question

我花了太长时间试图删除选择框左侧的额外间距，在Chrome开发者工具中，我终于看到用户代理样式表添加了2px margin-left（在Computed Style下查看）。但是，当我点击margin-left下拉列表以查看此样式的定义位置时，它表示它被定义为0em，如下面的屏幕截图中......有人可以向我解释这个吗？

Answer 1

我也遇到了这个问题 - 设置明确的高度解决了这个问题。

原因：

“*内在边距的目的是试图防止相邻的控件彼此对接。特别是使用圆形控件这看起来很糟糕。你看到值变化的原因是我们只在设想时才设置内在边距不会破坏页面的布局。如果作者在控件上指定了明确的高度/宽度，那么我们假设设计师需要像素精确控制，因此我们关闭边距以避免破坏页面布局。 / p>

此功能最初是由谷歌的首页推动的，该首页有两个按钮，彼此对接。它们现在在页面的现代版本上有间距，但在过去它们没有。这也发生在Web上的所有位置，尤其是按钮旁边的文本字段。它们最终在OS X上看起来很糟糕（它们在Windows上看起来也很糟糕，只是不那么糟糕）。*“

来源：http://code.google.com/p/chromium/issues/detail?id=128306

Answer 2

从该屏幕截图来看，它看起来像是这样的规则： margin: 2px 2px 4px 2px覆盖用户代理最初指定为0em

的内容