小编use*_*339的帖子

bootstrap下拉菜单重叠包装div

允许引导按钮下拉列表与包含div重叠的正确方法是什么?包含div有overflow-y:scroll.当前问题是当显示包含下拉内容时,内容保持在可滚动div内.

尝试使用下拉列表的绝对定位,将位置css更改为固定确实允许重叠.这是正确的方法吗?

这是jsfiddle演示:http: //jsfiddle.net/weaver_je/pA6cx/1/

位置:固定的第一个按钮(.btn1)最接近所需的输出.

<div style="width:120px; height:150px; overflow-y:scroll;">
<div class="dropdown">
  <button class="btn dropdown-toggle btn1" type="button" id="dropdownMenu1" data-toggle="dropdown">
    Dropdown
    <span class="caret"></span>
  </button>
  <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li>
    <li role="presentation" class="divider"></li>
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li>
  </ul>
</div>

    <br/><br/>

<div class="dropdown">
  <button class="btn dropdown-toggle btn2" type="button" id="dropdownMenu1" data-toggle="dropdown">
    Dropdown
    <span class="caret"></span>
  </button>
  <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li> …
Run Code Online (Sandbox Code Playgroud)

css jquery twitter-bootstrap

7
推荐指数
1
解决办法
1万
查看次数

标签 统计

css ×1

jquery ×1

twitter-bootstrap ×1