ie bug where a select dropdown is 'above' a transparent layer

Forum Moderators: open

Message Too Old, No Replies

ie bug where a select dropdown is 'above' a transparent layer

sneaks

1:33 pm on Jul 18, 2007 (gmt 0)

hi, i have a div with width:100% and height:100% that is 25% opacity. there a bug in ie6 that puts dropdowns above it for some reason unless the transparency is off. has anyone experienced this and found a fix for it? right now i am just turning the select visibility off when the transparency layer is active but its a weak fix.

thanks
jd

vincevincevince

1:43 pm on Jul 18, 2007 (gmt 0)

Try making the <select> 99.5% transparency

sneaks

2:00 pm on Jul 18, 2007 (gmt 0)

didnt work:
applied-> filter:alpha(opacity=99.5); to the select but it didnt change things... this bug has been giving me issues for about 4 months!

thx though
jd

Xapti

7:29 am on Jul 21, 2007 (gmt 0)

The fact that not using transparancy fixes it is strange. I've encountered and heard of this error without involving transparency. It's a bug in IE's Z-stacking, which really can't be avoided, only sometimes circumvented. Like I heard iframes will stack over top of them correctly.
Aside from that info I can't help much more.
What exactly are you doing? covering a section of content with a transparent div? You never mentioned what's supposed to be covering what, or anything else about the context.

XtendScott

3:48 pm on Jul 24, 2007 (gmt 0)

there is an IE Hack/fix.
The only thing that will cover the dropdown is a <iframe>. Put the empty Iframe first and float:left; filter:alpha(opacity=0).

example:

<YOUR CONTAINER DIV>

<iframe id="menu4iframe" src="javascript:'';" marginwidth="0" marginheight="0" align="bottom" scrolling="no" frameborder="0" style="position:absolute; left:0; top:0px; display:block; filter:alpha(opacity=0);" ></iframe>
<YOUR HTML CODE GOES AFTER IFRAME>
</YOUR CONTAINER DIV>

Hope this helps.