Text vertical alignment in select box - firefox problem

I have a problem with the vertical alignment of the select box header in Firefox.

screen from Firefox

The CSS for selection is as follows:

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, everything looks fine:

enter image description here

Help!

+8
css firefox select vertical-alignment
source share
2 answers

You can try this

 padding:.3em;/.4em; 

depending on your configuration.

+14
source share

Another method that I prefer is the following:

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

Install padding-top as you like. Everything that is in brackets @-moz-document url-prefix() will be executed only in Firefox.

0
source share

All Articles