javascript - 在 Bootstrap 3.0 中设置下拉列表的宽度

标签 javascript html css twitter-bootstrap

如何在 bootstrap 3.0 中将下拉触发按钮的宽度设置为等于下拉列表的宽度?类似于使用 bootstrap-select ( http://silviomoreto.github.io/bootstrap-select/ ) 时的效果。我试图用 col-* 类将整个列表包装在一个 div 中,但这似乎不起作用:

<div class="row">
<div class="col-xs-4 col-md-4">
    <div class="dropdown">
      <button type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown">Button</button>
          <ul class="dropdown-menu" role="menu">
            <li><a href="#">Action</a></li>
            <li><a href="#">Action</a></li>
            <li><a href="#">Action</a></li>
          </ul>
    </div>
</div>

因此,我想:按钮宽度 = 下拉菜单列表 = col-* 宽度。

最佳答案

我通过设置下拉菜单和按钮宽度=100% 找到了解决方案。

.dropdown-menu {
  width: 100%; 
}

.btn{
 width: 100%;
}

现在按钮和下拉列表的宽度相同,由列宽控制。

关于javascript - 在 Bootstrap 3.0 中设置下拉列表的宽度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18590929/

相关文章:

javascript - 悬停时图像到另一个图像的过渡

python - 如何从列表中删除错误的URL?

javascript - 将静态标题保持在所有其他元素之上

javascript - 检查代码是否与 IE 5 兼容

html - 隐藏 SVG 会影响同一页面中的其他 SVG 样式

css - 以等边距居中图像的简单方法

javascript - 在 leaflet LayerGroup 中的单个标记上触发事件

javascript - 我的应用程序如何知道 Android 设备是否收到了新消息

css - 可折叠的导航栏在手机屏幕上变得不可见

javascript - 将按钮绑定(bind)到根据文本框中值的大小激活的多个文本框