The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS [Solved] IE7 dropdown menu (the bad, the worse, the ugly) Reply To: [Solved] IE7 dropdown menu (the bad, the worse, the ugly)


Okay, here’s the news.

Full code snapshot: (

I have added the following:

/* Z-indexing for older IE */
.mainmenu {
  /* has position: fixed */
  z-index: 597;
.mainmenu .row {
  position: relative;
  z-index: 598;
ul.nav-main {
  position: relative;
  z-index: 599;
ul.nav-main li {
  position: relative;
  z-index: 600;
ul.nav-sub {
  /* has position: absolute */
  z-index: 601;
ul.nav-sub li {
  position: relative;
  z-index: 602;
/* quick hack to set z-index on any element following the mainmenu; should work in IE7 */
.mainmenu ~ * {
  position: relative;
  z-index: 1;

This actually fixed the IE10 bug, but not the IE7 one. In IE7, the submenu still disappears as soon as the cursor passes the first item (seriously IE?). By inspecting, I can see that it is not a spacing issue, though IE7 does have some strange notion that these <li>s need a bit of extra space up top. Could I possibly have missed an element that needs positioning?