How can I set alignment for a ListItem in a DropDownList?

夙愿已清 提交于 2020-01-14 18:50:11

问题


I have a DropDownList in my aspx file like this:

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

In Chrome it renders like this:

How can i set the alignment on all ListItems to be to the right so that values are properly aligned? I tried setting style="text-align:right" on the DropDownList and on the ListItems but it doesn't have any effect. I need a solution that also works on Chrome.

Thanks for replies!


回答1:


Adding the following style will align the numbers as required but will move the drop down arrow to the left instead of the right.

Other than using this I assume the inability to right align select options may be a limitation in Chrome.

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



回答2:


the below code works for me

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


来源:https://stackoverflow.com/questions/6938374/how-can-i-set-alignment-for-a-listitem-in-a-dropdownlist

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!