0

Asked to help fix the submenu flyout z-index on an old Wordpress theme Website. Sub flyouts are behind main dropdown. I have never seen menu code written this way. Any tips? I have tried 

position: relative;
z-index:99999! important;

with little effect.

#menu {
 float: right;
 margin-top: 5px;
 margin-bottom: 42px;
}
ul#menu {
 -moz-border-radius: 3px 3px 3px 3px;
}

ul#menu li a {
 text-decoration:none;
 font-size: 16px;
 /*text-transform:uppercase; */
 /* letter-spacing: 2px; */
 font-family: arial, sans-serif;
 font-weight:500;
 color: #fff;

}
ul#menu li {
 -moz-border-radius: 3px 3px 3px 3px;
}
ul#menu li li{
 -moz-border-radius: 0px 0px 0px 0px;

} 
ul#menu li:hover {
 background-color: #000033;
}
.current_page_item {

}
.current_page_item a{
 color: #fff!important;
}
ul#menu li:hover > a{
 color: #fff;
}
ul#menu li li:hover {
 background-color: #eee;
}
/*
ul#menu li li:hover > a{
 color: #ffffff;
} */
ul#menu li li a{
 color: #bdbdbd;
 background-color: #000033;
 text-decoration:none;
 font-size: 14px;
 font-weight:400;
}
ul#menu li a:active, ul#menu li a:hover {
 color: #ffffff;
 background-color: transparent;
}
ul#menu li li a:active, ul#menu li li a:hover {
 color: #000033!important;
 background-color: #ffffff;
}
Regular Jo
  • 5,190
  • 3
  • 25
  • 47
selfactualized
  • 1
  • I'd just get rid of all the `z-index`es you can, and start using them from the ground up, using rational numbers. – rnevius Oct 29 '14 at 19:48

1 Answers1

0

Hi you seem to have an uncaught TypeError on the menu.js file, perhaps that could be the issue. See type errors here

Community
  • 1
  • 1
Asa
  • 125
  • 1
  • 3
  • 12
  • Good point. I'll take a look. I made a few changes to move the menu to the right and not worry about the z-index. Not perfect at all, still need to remove the translucent box, but a start. ul#menu li li li{ -moz-border-radius: 0px 0px 0px 0px; width: 200px; float:left; left:65px; } – selfactualized Oct 29 '14 at 22:34
  • If you look closely at the child of the child it aligns with the parent in the very top menu, so at a guess it's absolute position is being set by the upper nav element width. – Asa Oct 29 '14 at 23:26