Forum Moderators: not2easy
Once again, I have been a-Googling in vain...
I have seen for myself that IE6 does handle z-index... on certain elements (e.g paragraphs that 'overlap' via padding)... something to with stack levels...
Anyhoo... try as I might, I have no idea how to make the popup appear 'over' a <select>
So, now I have my fingers crossed... hoping that the WebmasterWorld CSS gurus can/will help
Thanks in advance
Cheers
lavazza
Validated html and css
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-GB">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>ie6 z index bug</title>
<style type="text/css">
<!--
a.popup {
position:relative; /* this HAS to be relative */
z-index:3;
background-color:#ccc;
color:#000;
}
a.popup:hover {
z-index:4;
background-color:#0f0;
}
a.popup span {
display: none;
}
a.popup:hover span {
display:block;
position:absolute;
top:1.5em;
left:0.5em;
width:7em;
border:3px solid #f00;
background-color:#00f;
color:#eee;
}
select {
z-index:0 ! important;
}
-->
</style>
</head>
<body>
<h1>
z index bug in ie6
</h1>
<p>
<a class="popup" href="http://www.example.com">
Lorem ipsum dolor sit amet<span>Consectetuer adipiscing elit. Donec in prus a dui venenatis laoreet.</span></a>
<br>Maecenas iaculis justo non leo.
<br><input type="text"value="Aliquam erat">
<br><select><option>Vestibulum sollicitudin</option></select>
<br>Sed hendrerit nunc non quam.
</p>
</body>
</html>
As far as I remember, putting them in a lower stacking context still wouldn't help I don't think, right?
I think the solutions were to use a flash file, iFrame, or another form element to overlap the element, and style it to look as if it was a div (disabled textarea would be the most likely). Since links don't work in textarea (I don't think, especially a disabled one), I think the only option would be the really annoying method of using a flash file, or the pretty feasible option of using an iframe.
Overall though, I'd say just screw IE6. People will hopefully realize it's the browser's fault, and complain to their superiors to get ther computer updated (since as far as I know, it's only business computers that are mostly still running IE6)
Sorry if my lack of knowledge/memory isnt' useful. I didn't look at the previous topics, but I'm sure they are around, and carry more information on this topic.
[edited by: Xapti at 4:52 pm (utc) on July 21, 2008]
It's reassuring to know that this place is always here as a source of great - and prompt - advice :)
I'd say just screw IE6
Try googling for iframe shim
Thanks for the keyword tip :)
Found a few promising looking sites... Now I know what to play with :)