我有一个ajaxtoolkit AutoCompleteExtender,它的位置是:绝对。我将其放置在div内,位置为:relative。这样一来,扩展程序下拉菜单就可以完美地在所有浏览器上放置,但Chrome / Safari除外,在Chrome / Safari上,该位置相对于窗口的左上角而不是div。
当我放置另一个具有与AutoCompleteExtender生成的HTML相同的CSS类和内联样式的ul时,在Chrome中定位正常。因此,扩展程序有一些特定的功能,使其可以在HTML代码的底部(在end标记之前)呈现,因此在计算位置时不将div用作父级。
有什么想法可以解决吗?
码:
<div class="searching"> <ajaxToolkit:AutoCompleteExtender runat="server" ID="biznameOrCategoryAutoComplete" TargetControlID="txtBizNameOrCategory" ServicePath="~/AutoComplete.asmx" ServiceMethod="GetBiznameOrCategoryCompletionList" MinimumPrefixLength="1" CompletionInterval="1000" EnableCaching="true" CompletionSetCount="10" CompletionListCssClass="autocomplete_completionCompyNameListElement" CompletionListItemCssClass="autocomplete_listItem" CompletionListHighlightedItemCssClass="autocomplete_highlightedListItem" ShowOnlyCurrentWordInCompletionListItem="true"> </ajaxToolkit:AutoCompleteExtender> </div>
CSS:
.searching { margin-left:5px; padding-top:10px; width:366px; position: relative; } .autocomplete_completionCompyNameListElement { background: #fff; font-family:Arial, Helvetica, sans-serif; font-size: 17px; width: 340px !important; left: 20px !important; border: 1px solid #d9d9d9; font-size: 12px; top: 48px !important; padding: 2px 4px !important; }
尝试<div>在具有spcified id属性的扩展程序之后立即添加纯HTML 元素,并将此id值用于扩展程序的CompletionListElementID属性。
<div>
id
CompletionListElementID
当您将传递id给扩展程序时,它将项目插入为<div>元素。因此,添加纯HTML <div>而不是HTML 可以<ul>维护有效的HTML。
<ul>