如何在 div bootstrap 4 中适应下拉菜单

【问题标题】：How to fit dropdown in div bootstrap 4如何在 div bootstrap 4 中适应下拉菜单
【发布时间】：2019-03-19 21:42:00
【问题描述】：

我是 Bootsrap 4 的新手，我想将下拉菜单放入 div 中。我已经用 Bootstrap 4 编写了以下代码来实现上述功能，但它不起作用：

<div class="p-2 bg-info col-md-4">
     <div class="dropdown">
         <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
                Dropdown
         </button>
         <div class="dropdown-menu">
               <a class="dropdown-item" href="#">Link 1</a> <a class="dropdown-item" href="#">Link
               2</a> <a class="dropdown-item" href="#">Link 3</a>
         </div>
    </div>
</div>

【问题讨论】：

标签： bootstrap-4

【解决方案1】：

在dropdown-menu 和btn-block 上使用Bootstrap 4 w-100 实用程序类来使按钮全宽...

<div class="p-2 bg-info col-md-4">
     <div class="dropdown">
         <button type="button" class="btn btn-primary btn-block dropdown-toggle" data-toggle="dropdown">
                Dropdown
         </button>
         <div class="dropdown-menu w-100">
               <a class="dropdown-item" href="#">Link 1</a> <a class="dropdown-item" href="#">Link
               2</a> <a class="dropdown-item" href="#">Link 3</a>
         </div>
    </div>
</div>

https://www.codeply.com/go/H1QUpWhQZD

另见：
How to make width of dropdown-menu equal to width of it's parent in bootstrap 4
How to make a Bootstrap 4 full width dropdown in Navbar?

【讨论】：