選擇菜單填充但不能移動拖放箭頭

Question

我想知道是否有任何方法可以爲選定的文本提供正確的填充，但不能讓箭頭移動。

在這個html中，我給了正確的填充爲15px，它正在填充包括下拉箭頭。我真正需要的是，箭頭和選定選項之間有一點空間（因爲選項文本太長，現在箭頭下方，這就是爲什麼我需要在箭頭和選定選項之間留出空白區域）

這裏是我的代碼

HTML

<select> 
    <option>An Option xvcxbxcvb cvn cvncvnb</option> 
    <option>An Option xvcxbxcvb cvn </option> 
</select> 

CSS

select { 
    line-height: 30px; 
    padding:9px 15px 9px 9px; 
    width:150px 
} 

Fiddle

Answer 1

你能不能只設置selectwidth:到auto;

select { 
    line-height: 30px; 
    padding:9px 15px 9px 9px; 
    width:auto; 
} 

Updated Fiddle