html - 选择菜单填充但不移动下拉箭头

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
}

score -1 · Accepted Answer

你能不能select width:把auto;

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

1 回答 1