家長的div容器隱藏下拉菜單

Question

它相當困難的在的jsfiddle創建此所以我要繼續前進，並粘貼截圖，HTML和CSS：

我有顯示問題在上面的圖片中下拉菜單。

HTML和CSS：

<div class="row-fluid profile-gallery-image-container"> 
    <div class="span12"> 

     <a href="#"><img src="#"/></a> 

     <div class="image-options"> 

      <div class="dropdown"> 
       <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="icon-cog icon-white"></i></a> 
       <ul class="dropdown-menu"> 
        <li><a href="javascript:void(0);">test</a></li> 
       </ul> 
      </div> 

     </div> 

     <div class="delete-image"> 
      <a href="javascript:void(0);"/></a> 
     </div> 
    </div> 
</div> 


.profile-gallery-image-container { 
max-width: 130px; 
max-height: 110px; 
margin-bottom: 0px; 
display: inline-block; 
position: relative; 
border: 2px solid rgba(140,140,140,1); 
z-index: 0; 
} 

.image-options { 
float: right; 
top: 0px; 
right: 0px; 
position: absolute; 
padding-top: 2px; 
border-left: 2px solid rgba(255,128,64,1); 
border-bottom: 2px solid rgba(255,128,64,1); 
width: 15px; 
height: 15px; 
} 

我到底做錯了什麼？

Answer 1

這可能與z-index級別有關，或者可能是溢出設置。

將父容器設置爲「overflow：visible;」將是一個開始 - 但我會看菜單CSS上的位置：相對位置 - 這通常有助於解決問題。

但最終沒有看到一個工作演示，我無法弄清楚。