Home/ Questions/Q 6592935
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-25T17:37:06+00:00

I have created a menu in HTML and CSS that works in all the

  • 0

I have created a menu in HTML and CSS that works in all the major browsers (Chrome, Firefox, IE8+, and Safari). You can find it here: http://www.calvaryccm.com/MenuTest.aspx

The problem occurs in IE 7.

I have a hover menu using some JS for effect. When I try to render it in IE7 this is what happens:

IE 7 Menu Error

I need some help figuring out how to position the menu under the text. Thank you for your help!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I’m not sure whether you want to use .block or .nav in the selectors below. I’ve gone with .block because I can see it being applied to the element.

    • On .block ul, remove overflow: hidden.
    • On .block li, add position: relative.
    • On .block ul.nav ul, add left: 0.

    You now have the infamous IE6/7 z-index problem:

    • To fix it in this case, on .block ul, add position: relative; z-index: 3.
    • z-index: 3 to be one higher than the z-index on #player-area.
    • 0