Wordpress中的Z-Index子菜单不起作用

Question

我遇到了问题，我的子菜单一直在菜单下面。 （理事会标签） http://aus.arts.ubc.ca /

我只能访问css而且我不知道我做错了什么。 （有一半的东西写在我面前）

以下是CSS的代码：

/*AUS Website Theme, Summer 2011
Adapted for UBC CLF override.

Carson Lam
carson.lam@alumni.ubc.ca
Arts Undergraduate Society of UBC
*/
/*
Things we strip out include:
 * HTML code
 * @import rules
 * comments (upon output)
 */
 #UbcHeaderWrapper{
   background-color:#e7c5f6; 
   position: relative;
}
body  {
 /* background-color:#EECEFD;*/
  background-color: #EECEFD; /* Old browsers */
  background-color: -moz-linear-gradient(top, #EECEFD 0%, #c194d4 50%, #ab77c0 85%,    #7F3E98 100%); /* FF3.6+ */
  background-color: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#EECEFD), color-stop(50%,#c194d4),    color-stop(85%,#ab77c0), color-stop(100%,#7F3E98)); /* Chrome,Safari4+ */
  background-color: -webkit-linear-gradient(top, #EECEFD 0%,#c194d4 50%,#ab77c0 85%,#7F3E98 100%); /* Chrome10+,Safari5.1+ */
  background-color: -o-linear-gradient(top, #EECEFD 0%,#c194d4 50%,#ab77c0 85%,#7F3E98 100%); /* Opera 11.10+ */
  background-color: -ms-linear-gradient(top, #EECEFD 0%,#c194d4 50%,#ab77c0 85%,#7F3E98 100%); /* IE10+ */
  background-color: linear-gradient(to bottom, #EECEFD 0%,#c194d4 50%,#ab77c0 85%,#7F3E98 100%); /* W3C */
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#EECEFD', endColorstr='#7F3E98',GradientType=0 ); /* IE6-9 */
position: static;
}


#AusHeader {
  margin-top: 3px;
  background-color:#7F3E98;
}
#AusLogoContainer {
  padding: 0 25px;
}

/* Top menu. */
#menu-top-menu.single-tab {
  border-bottom: 6px solid #7F3E98;
  background-color:#fff;
   position: relative;
  z-index:-1;

 }
 #menu-top-menu.single-tab ul li a {
   color: #7F3E98;
   font-size: 16px;
    position: relative;
   z-index:-1;

 }
 #menu-top-menu.single-tab ul li:hover a,
  #menu-top-menu.single-tab li.current_page_item:hover a,
 #menu-top-menu.single-tab li.current_page_ancestor:hover a {
   background-color: #fff;
   color:#9F3E98;
   text-decoration:none;
    position: relative;
   z-index:-1;


   }

/* Dropdown menu. */
#menu-top-menu.single-tab.single-dropdown ul li:hover li a {
  color: #7F3E98;
  font-size: 14px;
  position: static;
  z-index:90000;




   }
   #menu-top-menu.single-tab.single-dropdown ul ul li a:hover {
   background-color:#fff;
   color:#9F3E98;
   position: static;
   z-index:900000;


   }

   /* Single-left-column page layout. */
   .singular-page.l2-column #primary {
     width:180px;
  }
  .singular-page.l2-column .content {
    width:740px;
    border-left: 4px solid #EECEFD;
  }
  .singular-page.l2-column .content .entry-title, 
  .singular-page.l2-column .content .entry-content,
  .singular-page.l2-column .content .entry-meta {
   margin-left: 25px;
   }

  .widget, .widget_subpages_navigation {
   border-bottom: none;
   margin-bottom:20px;
 }
  .widget_subpages_navigation ul li a {
   color:#757695;
   font-size:10pt;
  }

  h1,h2,h3,h4,h5,h6,
   h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    color:#54567C;

    }
    h1 a, h1 a:hover {
    font-size:16pt;
    font-weight:bold;
    color: #7F3E98;
   }
  h2, h3 {
   text-transform:uppercase;
    font-weight:bold;
    }

  a {
    color:#7F3E98;
    }
 a:hover {
  color:#9F3E98;
}

Answer 1

please remove z-index from this 

#menu-top-menu.single-dropdown li




and use some new style


<style>
ul.sub-menu li,ul.sub-menu li a
{
    z-index:9999!important;
}

#menu-top-menu li.current_page_item, #menu-top-menu li.current-menu-item, #menu-top-menu li.current-menu-ancestor, #menu-top-menu li.current_page_ancestor, #menu-top-menu li:hover
{
    background:none!important;
}
</style>

然后会显示如下

Answer 2

您需要在最后一个项目上设置较低的z-index，因为它们目前都具有相同的

#menu-item-2341 {
    z-index: -1;
}