asp.net - 如何右对齐 DropDownList 中的选项？

Question

我试图右对齐 DropDownList 的选项，但它似乎不起作用。

HTML:

<asp:DropDownList runat="server" CssClass="MyDDL">
    <asp:ListItem Text="1234"></asp:ListItem>
    <asp:ListItem Text="123"></asp:ListItem>
    <asp:ListItem Text="12345"></asp:ListItem>
</asp:DropDownList>

CSS:

.MyDDL
{
    width:100px;
    text-align:right;
}

正在应用 CSS(DropDownList 的宽度增加到 100px)，但里面的选项保持左对齐。

这里有什么问题吗？

---

更新

它在 Firefox 中完美运行!
这可能是 Internet Explorer 的问题吗？
我正在运行 IE11。

Answer 1

似乎没有一种好的、跨浏览器的方式来做到这一点。最好的解决方案是使用 dir 属性或 CSS direction 属性从右到左对齐:

<asp:DropDownList ID="DropDownList1" runat="server" CssClass="MyDDL" dir="rtl">

.MyDDL
{
    width:100px;
    direction:rtl;
}

但是正如您所提到的，这将导致 select 的箭头向左移动。否则，我知道的唯一选择是设置 text-align:right 正如你已经完成的那样，但这似乎只在 Firefox 中工作(在 IE8 中测试, Firefox 27 和 Chrome 33)。