在IE浏览器中的select标签选项之间添加空格

Question

我想在IE浏览器中的select元素的2个选项之间添加一个空格。我的代码在Firefox和Chrome中运行，使用我为select元素编写的CSS。但是，样式不适用于IE。这是 select 元素的CSS就像：

.branchDropdown { border: 1px solid #999999; width: 155px; } 

和选项元素：

.branchDropdown option { cursor: pointer; margin-top: 10px; }

Answer 1

您无法在Internet Explorer中使用大多数属性设置<option>个元素。除了背景和字体颜色外，它们从Windows操作系统继承了该样式。以下是<option>的MSDN页面中的引用：

  

除背景颜色和颜色外，将忽略通过选项元素的样式对象应用的样式设置。此外，直接应用于各个选项的样式设置将覆盖应用于整个包含的select元素的样式设置。

     

http://msdn.microsoft.com/en-us/library/ie/ms535877(v=vs.85).aspx

要创建一致的外观，您唯一的另一个选择是使用JavaScript来呈现替换页面上默认选择元素的自定义元素。

Answer 2

CSS中无法直接访问option元素中的

select个元素，您需要使用javascript替换来以这种方式自定义select元素。看到这个有趣的blog entry。另一种替代js是select2。