用于firefox字段的浏览器特定的CSS填充

Question

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

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

关于如何绕过这个的任何想法？下面显示的问题小提示，如果你在Chrome和Firefox中检查这个，我想要它，以便文本总是在中间

http://jsfiddle.net/uHDa6/

Answer 1

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

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

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

但是，对文本位置不匹配问题的实际解决方法是不设置高度，而只设置选择的填充。没有黑客。

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

这在所有浏览器中都有所期望的效果。请参阅new fiddle。