AutoCompleteExtender 渲染问题答案

【问题标题】：Issue with AutoCompleteExtender renderingAutoCompleteExtender 渲染问题
【发布时间】：2010-10-19 01:50:35
【问题描述】：

我在我的应用程序中使用 AutoCompleteExtender，不知何故，建议框开始出现在文本框下方，而不是下方 20-30 像素处。在挖掘生成的 HTML 后，我注意到它呈现为 UL 和 LI 元素，而在从 ASP.NET 下载的示例中，它呈现为 DIV 内的 DIV 并且工作正常。

我不知道是什么使它呈现不同。如何在文本框正下方显示建议列表？

顺便说一下，在 IE 中看起来不错，这个问题只存在于 firefox 中。

【问题讨论】：

标签： firefox asp.net-ajax ajaxcontroltoolkit

【解决方案1】：

您将不得不使用您的 CSS。默认（来自示例）是：

visibility : hidden;
margin : 0px !important;
background-color : #f0f0f0;
color : windowtext;
border : buttonshadow;
border-width : 1px;
border-style : solid;
cursor : 'default';
overflow : auto;
height : 200px;
text-align : left; 
list-style-type : none;

例如，我在我的一个网站上添加了：

.autocomplete_completionListElement li
{  
    margin : 0px !important;
    padding: 2px;
}

但是您需要使用Firebug 之类的东西来确定您有什么规则正在应用到您不想成为的规则。请记住，CSS = Cascading 样式表，因此父元素或规则可以像这样影响库元素。

【讨论】：

你让我走上了正轨。结果 CompletionListCssClass 属性完全丢失。一旦我用 Maring: 0px 添加了它，它在 Firefox 中渲染得很好。