文本垂直对齐在选择框中 - Firefox问题

Question

我在Firefox中选择框标题的垂直对齐方式存在问题。

select for CSS看起来像这样：

select#cities_list {
    width: 95px;
    height: 45px;
    line-height: 45px;
    background: url('./img/select-arrow.png') no-repeat right transparent;
    -webkit-appearance: none;
    border: 1px solid #dcdcdc;
    border-left: none;
    border-right: none;
    padding: 0 10px;
    margin: 0;
    float: left;
}

在Chrome中，一切看起来都不错：

帮助！

Answer 1

你可以试试这个

padding:.3em;/.4em;

取决于您的配置。

Answer 2

另一种方法，我更喜欢的方法是：

@-moz-document url-prefix() {

    select {
        padding-top: 8px;
    }
}

将padding-top设置为您喜欢的任何内容。 @-moz-document url-prefix()括号内的任何内容都只能在Firefox上执行。