I have a jQuery dialog box with a form and I’d like for an autocomplete box attached to one of the form elements to float above the dialog box (so that if the list goes beyond the end of the dialog box, it won’t get cut off). I have the following CSS elements applied to the autocomplete div:
background:none repeat scroll 0 0 white;
float:left;
position:absolute;
z-index:9999;
It still will create a scrollbar in the dialog box. What’s the deal? I see the dialog box is z-index:1004; so I don’t know why mine’s not going ontop of it. Is what I’m trying to accomplish even possible?
The reason it happens is because your element is a child of the dialog’s container. z-index won’t do what you want. The element would need to be outside the dialog and positioned accordingly.