Chrome瀏覽器中的CSS選擇框不錯在Firefox中

Question

我只是嘗試爲webkit和moz瀏覽器設置選擇框，在webkit上它看起來不錯，但是在Firefox中它看起來很糟糕，默認選項不與垂直對齊選擇框。

你能幫我找到什麼是錯，此代碼，請：

CSS：

select{ 
    min-width: 100%; 
    width:inherit; 
    background: #fff; 
    height: 33px; 
    border-radius:5px; 
    font-size: 15px; 
    border:none; 
    box-shadow: 0px 0px 30px 20px rgba(255,255,255,0.5) inset,0px 0px 0px 1px #ccc; 
}select option,select option:hover{ 
    padding:5px; 
} 

HTML

<select> 
    <option>hey</option> 
    <option>hey2</option> 
    <option>hey3</option> 

</select> 

這裏提琴所以你可以看到它的外觀上的Firefox然後在Chrome中：/令人難以置信！

http://jsfiddle.net/wL8Rs/

我使用Chrome最新版本34.0和Firefox的最新版本29.0

Answer 1

添加填充選擇

select{ 
    min-width: 100%; 
    width:inherit; 
    background: #fff; 
    height: 33px; 
    border-radius:5px; 
    font-size: 15px; 
    padding:5px; 
    border:none; 
    box-shadow: 0px 0px 30px 20px rgba(255,255,255,0.5) inset,0px 0px 0px 1px #ccc; 
} 

http://jsfiddle.net/wL8Rs/3/