How can I fix this styling bug in IE6?

views:

169

answers:

How can I fix this styling bug in IE6?

I have a site I deployed for a client using Joomla, and a good number of visitors are using IE6. The client informed me that there is a styling bug when someone does a search and has the option to change the order or the page count. When they get to that screen and hover over the Shop menu item in the nav bar on the top the menu shows up behind the drop down lists below.

I did some research to find that this is somehow an IE6 bug possibly regarding the z-index, but I'm at a loss as to how I should change the style sheets to make the fix appropriately.

The web site in question is http://edwardjamesandco.com

+1 A:

Triptych 2009-12-12 23:46:51

@Triptych I'm attempting the iframe shim using the jquery plugin suggested by Dave, but it's still not working. I've added the iframe inside the nav div, thinking that would do it, but maybe I'm adding it in the wrong place?

Joseph 2009-12-13 02:29:45

+2 A:

:-(

This is a well-known CSS bug in IE6. AFAIK the workaround (it's horrible, shield your eyes) is to put an IFRAME underneath your menu so that the IFRAME obscures the improperly z-indexed SELECT. It's so very horrible.

But JQuery is here to the rescue, as always:

http://jetlogs.org/2008/05/09/jquery-fix-ie-select-box-z-index-bug/

Dave Markle 2009-12-12 23:47:10

@Dave there wouldn't happen to be a MooTools equivalent for this? Since I'm running Joomla it would be great if I could just piggy bag on the library they already use.

Joseph 2009-12-12 23:52:38

@Dave I've implemented the fix you suggest, but it's still not working. I make a call to jQuery('#nav').bgiframe(); and I can see that it adds the iframe, but the drop down list still shows up above it.

Joseph 2009-12-13 02:21:31

@Dave I solved the problem. The menu system is done with ULs, so I needed to add the iframe to the UL list that was going to be dropped down when the user hovers over it.

Joseph 2009-12-13 02:35:03

Try this http://brenelz.com/2009/02/03/squish-the-internet-explorer-z-index-bug/

but BTW on my PC in IE 6 dropdown not going behind select box

metal-gear-solid 2009-12-13 02:43:32

ansaurus

tags:

views:

answers:

How can I fix this styling bug in IE6?

related questions