select optionのことで聞きたいことが

質問

<select name="" id="" style="height:30px;line-height:30px;">
<option value="" id="item-1">あああ</option>
<option value="" id="item-2">あ</option>
<option value="" id="item-3">ああ</option>
</select>

optionの高さを広げて、さらに▼の位置を変えず、セレクトボックス内の文字位置をセレクトボックス内の縦の真ん中に持っていきたいと思っています。
現実的ではないのは分かっていますが、どうにかクロスブラウザに対応した方法があれば
教えてください。
ずっと悩んでいるのですが、答えが出ず教えてほしいです。
html cssでページはデザインしています。

回答No.1

ORUKA1951 · ベストアンサー

form select option{text-align:center;}

<select name="slect">
<option value="" selected>選択してください。
<option value="abc">あああ</option>
<option value="efg">あ</option>
<option value="hij">ああ</option>
</select>

　idはnameと同じでなければなりません、value="" id="item-1"はありえません。
　デフォルトの選択selectedを書いておきましょう。選択項目より長く

　text-alignに対応していないブラウザを考慮するなら
<select name="slect">
<option value="" selected>選択してください。
<option value="abc">　　あああ　　</option>
<option value="efg">　　　あ　　　</option>
<option value="hij">　　&nbsp;ああ&nbsp;　　</option>
</select>
しかないでしょう。

お礼

ありがとうございます。