css - 是否可以在选择框中将文本居中？

Question

我试过这个:http://jsfiddle.net/ilyaD/KGcC3/

HTML:

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

CSS:

select { width: 400px; text-align: center; }
select .lt { text-align: center; }

如您所见，它不起作用。是否有一种仅使用 CSS 的方法可以使文本在选择框中居中？

Answer 1

Chrome 有一个部分解决方案:

select { width: 400px; text-align-last:center; }

它确实使所选选项居中，但不使下拉列表中的选项居中。