css - Firefox 字段的浏览器特定 CSS 填充

Question

我的应用程序中有一个下拉列表，为了使它居中，我必须在 Mozilla Firefox 上添加 padding-top 10px 但在谷歌浏览器上它不需要填充。我如何定位选择列表以设置此浏览器特定。我希望我可以做类似下面的事情:

select {
  -moz-padding-top: 10px;
  -webkit-padding-top: 0px;
}

关于如何解决这个问题的任何想法？下面显示的问题的 fiddle ，如果你在 Chrome 中检查它，然后在 Firefox 中检查，我想要它，这样文本总是在中间

http://jsfiddle.net/uHDa6/

Answer 1

注意:此答案的第一部分现已过时，因为此功能已从 Firefox 中删除。要获得真正的答案，请继续阅读“但是”。

---

您的问题的答案是:是的，可以将特定于 Mozilla 的 CSS 放入样式表中。 (不在内联样式属性中。)
在这种情况下，你会写

@-moz-document url-prefix() {
    select {padding-top:10px;}
}

这只是 @document 规则的 Mozilla 前缀版本，其他浏览器无法识别。

---

但是实际解决文本位置不匹配问题的方法是不设置高度，只设置select的padding。没有黑客。

style="font-size: 14px; padding: 11px 0 11px 5px;"

这在所有浏览器中都有预期的效果。参见 new fiddle .