如何在DropDownList中为ListItem设置对齐?

时间:2011-08-04 08:32:35

标签: asp.net webforms drop-down-menu alignment listitem

我的aspx文件中有一个DropDownList,如下所示:

<asp:DropDownList runat="server" ID="MaxRec">
  <asp:ListItem>10</asp:ListItem>
  <asp:ListItem>50</asp:ListItem>
  <asp:ListItem>100</asp:ListItem>
  <asp:ListItem>150</asp:ListItem>
  <asp:ListItem Selected="True">200</asp:ListItem>
</asp:DropDownList>

在Chrome中,它呈现如下:

DDL

如何将所有ListItem上的对齐设置为右侧,以便正确对齐值? 我尝试在DropDownList和ListItems上设置style =“text-align:right”,但它没有任何效果。 我需要一个适用于 Chrome 的解决方案。

感谢您的回复!

2 个答案:

答案 0 :(得分:3)

以下代码适用于我

<head>
    <style type="text/css">
          select.myDropDownList {
            text-align: right;
          }
        </style>
 </head>  


 <asp:DropDownList ID="myDropDownList" Runat="server" CssClass="myDropDownList">
   <asp:ListItem>10</asp:ListItem>
    <asp:ListItem>50</asp:ListItem>
    <asp:ListItem>100</asp:ListItem>
     <asp:ListItem>150</asp:ListItem>
 </asp:DropDownlist>

答案 1 :(得分:3)

添加以下样式会根据需要对齐数字,但会将下拉箭头向左移动而不是向右移动。

除了使用此功能外,我认为无法正确对齐选择选项可能是Chrome中的限制。

.drop-down-list
{
    direction: rtl;
}