How do I make AutoCompleteExtender render above select controls in IE6

Question

When an AutoCompleteExtender is displayed in IE6 it seems to ignore z-index and renders below any select controls (like dropdownlists) in IE6.

<asp:TextBox ID="TextBox1" runat="server"  />
<cc1:AutoCompleteExtender ID="AutoCompleteExtender1" runat="server" 
    TargetControlID="TextBox1" EnableCaching="true" CompletionSetCount="5" 
    FirstRowSelected="true" ServicePath="~/Services/Service1.asmx" ServiceMethod="GetSuggestion" />
<asp:DropDownList ID="DropDownList1" runat="server">
    <asp:ListItem Text="Item 1" Value="0" />
    <asp:ListItem Text="Item 2" Value="1" />
</asp:DropDownList>

How do I make it render above dropdownlists?

Answer 1

@Orion has this partially correct - there is one other way to deal with these, and that is to cover the offending select lists with an iframe. This technique is used in Cody Lindley's ThickBox (written for jQuery). See the code for details on how to do it.

Answer 2

Nothing renders below select controls in IE6. It's one of the many "features" microsoft bestowed upon us when they gifted IE to the world

You have to hide them, then re-show them.

Observe the standard lightbox script - which does exactly this

(note that link is just to the first thing I found on google which had the source to lightbox.js as a demonstration. It's got nothing to do with anything else)