Question

以下CSS适用于FF，但不适用于IE（至少8.0），如何确保文本在IE8.0的中心对齐？感谢!!!

select, option {
    text-align: center;
}

Answer 1

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

Answer 2

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

实现自己的SELECT小部件。有许多JS库可以做到这一点，主要是因为SELECT输入很难设置样式。
在较小的选项前插入适当的空格。

编辑：看起来像空格不起作用，但HTML空间确实如此：

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

那真是个黑客...

Answer 3

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

例如： -

<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>

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

3 个答案: