[nova912]

i have <divs> that are floating boxes that hover with the mouse. This is working almost perfectly accept im running into a z-indexing issue with IE only. Its seems any <select> element is always on top.

I have tried the following to try and corret the issue.

Code:

<div>
<select>[options]</select>
</div>
// or
<div style="position: absolute">
<select>[options]</select>
</div>
// or
<div style="position: absolute; z-index:1">
<select>[options]</select>
</div>
//or
<div style="position: relative">
<select>[options]</select>
</div>

No matter what the select menu always trumps the floating <div> with a z-index of 100.

Is this an IE bug i am running into, and if so are there any work arounds?

[jfulton]

Yes, this is an IE issue. There are two solutions that I know of. The first is to hide the select so it doesn't show up "through" the div. The second solution is a bit more intense, but is much better aesthetically. Selects won't show up through iframes - so you add an iframe behind the "floating" div to block the select. I can't find the exact link that I've used before to do this, but if you google "iframe shim select" or something like that, you'll probably find something.

If I find the link, I'll post it here.

HTH