Question

我有一个bootstrap模式，包含两个多选和两个按钮。我希望所有控件都内联，但两个按钮堆叠，例如：

         BUTTON
SELECT           SELECT
         BUTTON

我有以下内容。表单以内嵌方式显示，但按钮没有堆叠（而是彼此相邻）。

＆＃13;

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.3/css/bootstrap.min.css" integrity="sha384-Zug+QiDoJOrZ5t4lssLdxGhVrurbmBWopoEl+M6BdEfwnCJZtKxi1KgxUyJq13dy" crossorigin="anonymous">
<div class="modal-body">

  <div style="display:inline">
    <select id="fam" name="fam" class="form-control" multiple="multiple" size="8" style="width: 300px">
            </select>
  </div>
  <div style="display:inline">
    <button type="button" class="btn btn-primary btn-xs">Button 1</button>
    <button type="button" class="btn btn-primary btn-xs">Button 2</button>
  </div>
  <div style="display:inline">
    <select id="fam_" name="fam" class="form-control" multiple="multiple" size="8" style="width: 300px">
    
            </select>
  </div>
</div>

＆＃13;

感谢。

Answer 1

Bootstrap支持垂直堆叠的按钮，btn-group-vertical。听起来像你想要的那样，加上它将按钮的边框合并在一起，使它们看起来很漂亮。

以下是w3学校文档的一个例子：

https://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_button_group_v&stacked=h

这将取代你的中间div，在选择

之间

如何插入两个堆叠按钮，但是以内联形式？

1 个答案: