Question

我在webForm应用程序的下拉列表中居中项目（选项）时遇到问题。

这是一个包含ddl的表：

<table class="grid">
        <tr>
            <td class="gridPagerCell">
                <asp:LinkButton ID="lbFirstPage" runat="server" Text="<<" OnCommand="onPage_Command" CommandName="PAGING" CommandArgument="<<" />
            </td>
            <td class="gridPagerCell">
                <asp:LinkButton ID="lbPreviosPage" runat="server" Text="<" OnCommand="onPage_Command" CommandName="PAGING" CommandArgument="<" />
            </td>

            <td class="gridPagerCell">
                <asp:DropDownList id="ddlSelectedPage" runat="server" CssClass="gridPagerDropDownList" AutoPostBack="True" OnSelectedIndexChanged="ddlSelectedPage_SelectedIndexChanged" />
            </td>

            <td class="gridPagerCell">
                <asp:LinkButton ID="lbNextPage" runat="server" Text=">" OnCommand="onPage_Command" CommandName="PAGING" CommandArgument=">" />
            </td>
            <td class="gridPagerCell">
                <asp:LinkButton ID="lbLastPage" runat="server" Text=">>" OnCommand="onPage_Command" CommandName="PAGING" CommandArgument=">>" />
            </td>
            <td style="width:100%; text-align:right;">
                <asp:Literal ID="ltTotalCount" runat="server" />
            </td>
        </tr>
    </table>

在i绑定下拉列表中的代码中：

if (!this.IsPostBack)
        {
            this.ddlSelectedPage.Items.Clear();
            for (int i = 0; i <= Helper.GetCountOfGridPages(this.TotalRecords, this.GridPageSize) - 1; i++)
            {
                var item = new ListItem((i + 1).ToString(), (i + 1).ToString());

                this.ddlSelectedPage.Items.Add(item);

            }
        }

这是一个CSS样式：

    .gridPagerDropDownList
{
    width:125px;
    text-align:center;
    left: auto; 
}
.grid
{
    width:100%;
    color: #000000;
}
.gridPagerCell
{
    margin-right: 5px;
    margin-left: 5px;

    padding-right: 5px;
    padding-left: 5px;
}

问题是在FF中我看到dll中心的下拉列表中的文本，在IE中Chrome和Chrome是左边的文本对齐，但我希望它在所有浏览器的中心对齐...

有任何解决方案吗？

Answer 1

正如许多帖子中提到的，没有可以对齐中心选择框的跨浏览器CSS。

您总是可以创建一个脚本来隐藏选择选项并使用div树模拟它。我找不到任何已经存在的插件，但可能会有一些插件。

DropDownList中的中心项

1 个答案: