下拉菜单被后面的元素隐藏

我有一个下拉菜单，似乎被DOM中的下一个文件夹隐藏。下拉菜单被后面的元素隐藏

div class="dropdown-tracks" > 


    <div class="btn-group"> 
     <a class="btn btn-primary" href="#"><i class="icon-filter"></i> Filter </a> 
     <a class="btn btn-primary" data-toggle="dropdown" href="#"> 
     <span class="icon-caret-down"></span> </a>          

      <ul class="dropdown-menu"> 
       <li><a href="#">Latest tracks (first 25)</a></li> 
       <li><a href="#"> Most liked tracks </a></li>         
      </ul> 
     </div> 
     </div> 

<div class="container" id="facebook-vids" style="background-color:#fdfcfc"> 
<!--content--> 
</div>

CSS：

.dropdown-menu { 
position: relative; 
z-index: 100; 
}

当菜单展开后，#facebook-vids DIV重叠的下拉菜单中的conetents。正如在stackoverflow其他答案建议的，我已经改变了位置和z-索引，但无济于事。

提前致谢！

来源

2016-04-26 Keshav Vasudevan

不确定你的父母div是什么，但我假设＃facebook-vids的父级比下拉级别高2级。所以为了解决这个问题，您可能需要将z-index设置为下拉菜单的相同级别的父级div以上至facebookvids zindex。希望你明白我的意思。 – Giri

您需要确定.dropdown-tracks的z-index高于.container。例如。

.dropdown-tracks { 
    position: relative; 
    z-index: 100; 
} 

.container { 
    position: relative; 
    z-index: 50; 
}

来源

2016-04-26 04:46:28

下拉菜单被后面的元素隐藏

回答

相关问题