How to fix z-index in internet explorer 6 (ie6)

Discussion in 'CSS' started by Arpowers, Oct 27, 2009.

  1. #1
    Hey everyone,
    Can anyone tell me how to deal with z-index in IE6?

    We're having a problem with some drop downs (only in IE6) in one of our WordPress themes.

    You can see the problem here:
    http://www.pagelines.com/demos/whitehousepro

    (make sure the drop-down option is active)

    The drop downs aren't showing over the other items even though they have a z-index of 300.

    Andrew
     
    Arpowers, Oct 27, 2009 IP
  2. Stomme poes

    Stomme poes Peon

    Messages:
    3,195
    Likes Received:
    136
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Warning, I did not look at your menu at all. If I have to turn some option on, then likely I would need Javascript on, which I don't. So I didn't bother.

    However there is a well-known (I guess) IE6 bug regarding z-index here, where dropdowns get hidden behind the rest of the page IF the "rest of the page" is set to position: relative or something.

    According to Anne van Kesteren, the way to fix this isn't making ginormous z-index levels on your absolutley-positioned subs (I assume this is where you have 300, on the submenu) but to put it on the parent, which in your case would either be the ul or the box the ul is in (if you have your ul inside another container for some reason).

    Here's the link explaining it: http://annevankesteren.nl/2005/06/z-index

    Good luck.
     
    Stomme poes, Oct 28, 2009 IP