Drop Down Menu dissappearing

  • Hi There,

    I have built a website for a school and seem to be having a problem with a drop down menu. I have done many before using left:-999px and on hover left:0. This works fine but as soon as I roll over the sub-menu it disappears all the time. If I catch it quick enough it works until I move off the link. I am fairly good at these problems (usually) however I am absolutely stumped here.

    I am aware that margins in the submenu li elements usually is the cause of the issue but they are flush and works fine in any other browser. I would appreciate anyone to have a quick look for me if I’m missing the obvious I have been on it for hours trying different things.

    Again this problem is only on IE the site is – https://greengatesprimary.org.uk/

Viewing 8 replies - 1 through 8 (of 8 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    This issue usually occurs when there is too much of a ‘top‘ value on the submenu.

    Thread Starter Jamie Gill

    (@patchgill)

    Doesn’t seem to be the issue here. I did add some top to try get it directly under the parent to test if it was the gap between the parent and the sub. I have removed the top and it doesn’t seem to fix it.

    Thanks for your time thought, appreciated.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Instead of removing it try reducing the value.

    Thread Starter Jamie Gill

    (@patchgill)

    Still doesnt seem to resolve the issue. I tried it at 0 (so it covered the actual parent link. Then 5px, 10px and so on until 25px (the original top value).

    Can’t believe I am struggling with this.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    I can’t see the ‘top‘ style applied to your submenu, can you reapply it?

    Thread Starter Jamie Gill

    (@patchgill)

    I have given it a top of 15px so you can see

    Thread Starter Jamie Gill

    (@patchgill)

    Hi Andrew,

    Someone was experiencing the same issue after and applied the following :-

    html {
    position:relative;
    z-index:-1000;
    }

    This makes the menu now work flawlessly. Still trying to figure why this even makes it work. Any ideas?

    Thanks again for your time and help on this matter

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    It sounds like IE treats z-index, or z-index extreme values specifically, differently from other browsers.

    I’ve not got enough time to look into this thoroughly and have so far found this CSSCreator thread with a moderator mentioning it: https://csscreator.com/node/17444

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Drop Down Menu dissappearing’ is closed to new replies.