如何确保在IE的中心选择选项文本对齐？

The following CSS works in FF, but not in IE(at least 8.0), how can I make sure that the text align in the center for IE8.0? Thanks!!!

以下CSS适用于FF,但不适用于IE(至少8.0),如何确保文本在IE8.0的中心对齐?谢谢!!!

select, option {
    text-align: center;
}

3 个解决方案

#1

Unfortunately, you can't change the alignment of SELECT items in IE, although it surprises me that even IE 8 keeps this bad habit.

不幸的是,你不能改变IE中SELECT项的对齐方式,尽管让我感到惊讶的是即使是IE 8仍然存在这种坏习惯。

#2

Given that this is not possible in IE, I think you would have to resort to:

鉴于这在IE中是不可能的,我认为你不得不诉诸:

Implementing your own SELECT widgets. There are many JS libraries that do this, mostly because SELECT inputs are hard to style.

实现自己的SELECT小部件。有很多JS库可以做到这一点,主要是因为SELECT输入很难设计。
Insert the appropriate whitespace in front of the smaller options.

在较小的选项前面插入适当的空格。

Edit: looks like whitespace doesn't work, but HTML space does:

编辑:看起来像空格不起作用,但HTML空间确实:

<SELECT>
   <OPTION>&nbsp;&nbsp;&nbsp;SMALL</OPTION>
   <OPTION>&nbsp;&nbsp;LARGER</OPTION>
</SELECT>

That's quite a hack...

这是一个非常黑客......

#3

-1

You can make a class and call it using the 'STYLE TAG' in the option field.::

您可以使用选项字段中的“STYLE TAG”创建一个类并调用它。::

For Eg:--

<style type="text/css">
select { width: 400px; text-align:center; }
select .lt { text-align:left; }
</style>




<select name="state" class="ddList">
<option value="">(please select a state)</option>
<option class="lt" value="--">none</option>
<option class="lt" value="AL">Alabama</option>
<option class="lt" value="AK">Alaska</option>
<option class="lt" value="AZ">Arizona</option>
<option class="lt" value="AR">Arkansas</option>
<option class="lt" value="CA">California</option>
<option class="lt" value="CO">Colorado</option>
</select>

#1