html - 隐藏在 div 标签中的下拉菜单

Question

我有这个隐藏在父 div 中的 twitter 引导下拉菜单，如下所示：

这是我的css和html：

<div class="profile-gallery-image-container">
    <img src="#" />
      <div class="image-options">
        <div class="dropdown">
          <a class="dropdown-toggle" data-toggle="dropdown" href="#"><b class="caret"></b></a>
            <ul class="dropdown-menu">
              <li><a href="#">test</a></li>
           </ul>
        </div>
    </div>
</div>

CSS

.profile-gallery-image-container {
    max-width: 105px;
    max-height: 80px;
    margin-bottom: 0px;
    display: inline-block;
    border: 2px solid rgba(140,140,140,1);
    overflow: visible;
}

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

twitter-bootstrap 下拉菜单的 z-index 默认设置为 1000，我尝试使用它，但它不想脱离父容器。我也尝试过溢出：可见样式但没有成功。我应该如何让它在盒子外面可见？

Answer 1

嗨，现在定义你position:relative; 的 .profile-gallery-image-container 班级

.profile-gallery-image-container {
position:relative;}

现场演示

---------

更新的演示