I've got a pretty standard site - header with a big graphic up at the top, four links at the right end of the header, and a menu underneath. When you point at the third link, it displays a little box explaining what it is, which partially overlaps the menu. The link calls a simple JavaScript that toggles the "display" property on the box from "none" to "block" and back again.
Here's the problem - in IE6, sometimes the box displays underneath the menu (as if its z-index is lower than the menu's), and sometimes it displays on top of it (like it's supposed to). I can't figure out any rhyme or reason to what causes the difference - it happens seemingly at random each time I load the page.
I tried playing around with z-index and stuff, but it didn't make a difference.
I saved the HTML from each case and ran a diff on it - the code is identical. Is this some weird bug or something? I don't see how the same code can display differently just by refreshing the page.
Any ideas? Sorry, I can't include sample code or a screenshot as this is an internal project.
I figured out that if I remove "position: relative" from the <li>'s that make up the menu, it fixes it...but of course that screws up other stuff. And that still doesn't explain why merely refreshing the page changes the appearance...
I've got a pretty standard site - header with a big graphic up at the top, four links at the right end of the header, and a menu underneath. When you point at the third link, it displays a little box explaining what it is, which partially overlaps the menu. The link calls a simple JavaScript that toggles the "display" property on the box from "none" to "block" and back again.
Here's the problem - in IE6, sometimes the box displays underneath the menu (as if its z-index is lower than the menu's), and sometimes it displays on top of it (like it's supposed to). I can't figure out any rhyme or reason to what causes the difference - it happens seemingly at random each time I load the page.
I tried playing around with z-index and stuff, but it didn't make a difference.
I saved the HTML from each case and ran a diff on it - the code is identical. Is this some weird bug or something? I don't see how the same code can display differently just by refreshing the page.
Any ideas? Sorry, I can't include sample code or a screenshot as this is an internal project.