css - IEで選択オプションのテキストを中央に揃えるにはどうすればよいですか?

Question

次の CSS は FF では機能しますが、IE (少なくとも 8.0) では機能しません。IE8.0 でテキストが中央に配置されるようにするにはどうすればよいですか? ありがとう！！！

select, option {
    text-align: center;
}

Answer 1

残念ながら、IE で項目の配置を変更することはできませんが、SELECTIE 8 でさえこの悪い習慣が続いていることに驚きました。

Answer 2

IEではこれが不可能であることを考えると、次のことに頼らなければならないと思います。

1. 独自のSELECTウィジェットを実装します。これを行うJSライブラリはたくさんありますが、これは主にSELECT入力のスタイルを設定するのが難しいためです。

2. 小さいオプションの前に適切な空白を挿入します。

編集：空白は機能しないように見えますが、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>