Ajax控件工具箱组合框在下拉列表中显示奇怪的项目符号

Question

我在网站上使用的是Ajax控件工具箱的组合框 。 我正在将自定义类型数据动态绑定到它。 这是我为此输入的aspx代码。

<ajaxToolkit:ComboBox ID="ddlAddAccount" runat="server" AutoPostBack="False" DropDownStyle="DropDownList" AutoCompleteMode="SuggestAppend" CaseSensitive="False" CssClass="ComboBoxStyle" ItemInsertLocation="Append"/>

这是该CSS：

.ComboBoxStyle .ajax__combobox_itemlist 
{ 
            border: 1px solid YellowGreen;  
            font-size:medium;  
            font-family:Courier New;  
            padding-left: 0px;  
            list-style:none;
            list-style-type:none; 
}

我面临的问题是，在页面上呈现DDL时，它在下拉菜单中显示了一些奇怪的框。 他们似乎是子弹。 但是尽管放了list-style-type：没有； 在CSS中，输出没有变化。 也就是说，仍然出现怪异的盒子。 这是渲染的组合框的屏幕剪辑：

我什至检查了呈现的HTML标记，以查看是否添加了任何字符，但没有。 <ul>标记中的<li>标记只是具有绑定元素的列表。

任何想法这可能是什么以及如何摆脱这些？ 我尝试了ddlAddAccount.Items.Clear(); 绑定之前，但这没有帮助。

非常感谢！

Answer 1

很可能其他样式与您的组合框冲突。

使用浏览器开发人员工具（ F12 developer tools in IE Tools --> developer tools ，Chrome中的Tools --> developer tools ）并隔离列表中应用的CSS。

此外，组合框也不会呈现为<option> 。 它应该呈现为无序列表（ <ul><li>...</li> ）

Answer 2

如果确实是列表项目符号项目，则可以尝试在样式中添加！important ，以确保未应用任何列表样式。

.ComboBoxStyle .ajax__combobox_itemlist
{
    border: 1px solid YellowGreen;
    font-size: medium;
    font-family: Courier New;
    padding-left: 0px;
    list-style-type: none !important; /* Add the important here */
}

我无法重现您的问题，但是您必须将某种CSS样式应用于导致此问题的ul或li标签。 我知道您提到过您取消选中浏览器中控件的所有样式，但是肯定有某些内容您错过了。

希望这行得通。