You are here because you are not satisfied about AJAX AutoComplete default styles. But we can apply our own css styles to AutoComplete. So we have to add some necessary properties for that. I have already written article for Ajax AutoComplete extender, please follow the link given below.

AJAX AutoComplete example

There are three style properties used to create our own styles to AutoComplete extender.

1.CompletionListCssClass

2.CompletionListItemCssClass

3.CompletionListHighlightedItemCssClass

CompletionListCssClass:

CompletionListCssClass is used to style the completion list flyout.

CompletionListItemCssClass:

          CompletionListItemCssClass is used to style an item in the AutoComplete list flyout.

CompletionListHighlightedItemCssClass:

          CompletionListHighlightedItemCssClass is used to style a highlighted item in the AutoComplete list flyout.

AutoComplete Extender control:

 <asp:AutoCompleteExtender ID="AutoCompleteExtender1" runat="server"

     ...

     ...

     CompletionListCssClass="completionList"

     CompletionListItemCssClass="listItem"

     CompletionListHighlightedItemCssClass="itemHighlighted">    

 </asp:AutoCompleteExtender>

CSS style:

<style type="text/css"> 

        .completionList {

        border:solid 1px Gray;

        margin:0px;

        padding:3px;

        height: 120px;

        overflow:auto;

        background-color: #FFFFFF;     

        } 

        .listItem {

        color: #191919;

        } 

        .itemHighlighted {

        background-color: #ADD6FF;       

        }

    </style>