我可以在html选择下拉菜单中的内容和箭头之间放一个空格吗

Question

我有一个选择下拉列表，其中有一个单词"girl"作为选项。

问题是女孩的"l"非常靠近select上的箭头下拉项。我怎么能在单词/内容（所有选项，我的意思是。我觉得没有必要只是瞄准单词"girL"）和小箭头之间多放一点"空间"？

我试过在"女孩"后面加一个空格，但没有效果（问题仍然存在）。

这是的样子

sex:    |boy |v|
        |girl| 

这是我想要的：

sex:    |boy  |v|
        |girl | 

是的，我知道这里几乎每个人都知道我在说什么。用管道绘制下拉列表很有趣！

PS html或css，我对解决方法漠不关心！

Answer 1

也许，这已经太晚了，但是，我将它作为下一个访问者的信息发布。

1. 设置width并非适用于所有情况。灵活的宽度有时很有用。

2. Padding-right也不是解决方案，因为它只在箭头和右边框，但不在文本和箭头之间。

3. 对于静态列表项，在每行末尾添加 是最好的解决方案。但如果你是动态的，谷歌浏览器会将其显示为文本，而不是特殊字符。

4. 对于动态变化，以下操作非常有效：

   option.text = itemtext + String.fromCharCode(160);

Answer 2

嘿，现在给padding right来选择标签，就像这个一样

   select{
    padding-right:40px; // as your requirement give to padding-right 
    }

现场演示http://tinkerbin.com/vPS8tXNJ

Answer 3

只需使用

  

在它后面添加一个空格…如果你在css中确实需要它。。。

padding-right: 10px;