I have a <div> that opens up on a jquery hover event (display goes from hidden to block).
Sometime it's opens up over some form elements. And of course it works fine in all browsers except IE6. <select> boxes bleed through as if there z-index is higher than the <div> tag. I've tried setting the <div> tag with a higher z-index, but it still gets ignored by IE6.
I'm hoping to implement any fix -- jquery or css, I really don't care at this point.
Any ideas?
As far as I know, there is no simple workaround for this (see this MSDN blog entry). I know only clever but really really complicated workarounds such as this one. Yuck!
z-index is buggy in all versions of IE but IE6 in particular lets "select" always be on top.
You can't just ditch a browser if customers still use it. IF I am going to put a div on top of an input field (particularily drop down boxes) then I set the .style.visibility to false on the underlying boxes before I put the div on top. It is crude, but it works.
