下拉菜單被後面的元素隱藏

我有一個下拉菜單，似乎被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

下拉菜單被後面的元素隱藏

回答

相關問題