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

Question

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

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

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

score 41 · Accepted Answer

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

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

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

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

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

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

这在所有浏览器中都有预期的效果。见新小提琴。

1 回答 1