下拉菜单的z-index不起作用

时间:2018-05-16 06:28:43

标签: html css html5

我的导航栏后面的下拉菜单,我应用了z-index,但没有支持。需要建议

css

 .ChangeColor1{
    z-index:-1    }

.adjTopSide{
        margin-top: -40px;
        z-index: -1;
    }

HTML

 <ul class="nav navbar-nav navbar-right adjTopSide">

      <li class="dropdown" >

          <a class="dropdown-toggle" data-toggle="dropdown" href="#/employerProfile" style="background-color: transparent;margin-top:-25px;"> <span class="caret"></span></a>
     <ul class="dropdown-menu" position: absolute" >
     <li ><a href="#/urprofile" style="cursor: pointer;">My Profile</a></li>
        <li><a ng-click="logout()" style="cursor: pointer;">Logout</a></li>
      </ul>
    </li>
  </ul>                                   
          <nav class="navbar navbar-static-top ChangeColor" >
    </nav>

my dropdown menu is coming behind nav bar

1 个答案:

答案 0 :(得分:4)

添加此样式。如果你给z-index那么就必须给出位置属性。

 .adjTopSide{
        margin-top: -40px;
         position: relative;
         z-index: 99;
    }