Increase AutoFill Extension List Width

Question

I have an ASP.NET AJAX autocomplete extender with CompletionListCssClass=autocomplete_completionListElement :

 .autocomplete_completionListElement { width:500px; margin : 0px!important; background-color : inherit; color : windowtext; border : buttonshadow; border-width : 1px; border-style : solid; overflow :auto; height : 200px; text-align : left; } 

But for some odd reason, the width of an automatic full list always takes up the width of the text box, even when I set the width to 500 pixels. Is there any way to fix this?

Answer 1

I finally figured it out. I used the OnClientPopulated="onListPopulated" property as follows:

 function onListPopulated() { var completionList = $find("AutoCompleteEx").get_completionList(); completionList.style.width = 'auto'; } 

Answer 2

I believe that you can also do this by changing

width:500px;

to

width:500px!important;

Tim Mackey outlines more in this blog post . Basically, you should use !important to override the CSS output from the control itself.

Answer 3

You need to set min-width to 500px