Text vertikal in Auswahlfeld ausrichten - Firefox-Problem

Question

Ich habe ein Problem mit der vertikalen Ausrichtung der Auswahlfeldbeschriftung in Firefox.

CSS für ausgewählte sieht wie folgt aus:

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; 
} 

In Chrome alles gut aussieht:

Hilfe!

Answer 1

Sie können die versuchen

padding:.3em;/.4em; 

je nach Ihrer Konfiguration.

Answer 2

Ein andere Methode, eine, die ich bevorzuge, ist dies:

@-moz-document url-prefix() { 

    select { 
     padding-top: 8px; 
    } 
} 

die padding-top Set, was auch immer Sie mögen. Alles innerhalb der @-moz-document url-prefix() Klammern wird nur in Firefox ausgeführt.