在引导程序中将 2 个元素保持在同一行

Question

我正在努力在引导模式的同一行上获得下拉列表和按钮。我试过使用 <,span> 但它不起作用。

<div class="col-md-12 hSpacerMob">
 <div class="well"> 
        using (Html.BeginForm("AddPlayerSignup", "SignupSheet"))
        {
          @Html.DropDownList("Member", tournament.SignupSheet.GroupMembers)
              <span>
                  @Html.SubmitButton("Add", true, new { @class = "btn btn-primary" })
               </span>
         }
       @Html.ActionLink("Pause", "ChangeState", "SignupSheet", new { Paused = true }, new { @class = "btn btn-warning" })
    </div>
  </div>

所以我需要在同一行上的下拉菜单和“添加”按钮彼此相邻，以及下面的暂停按钮，但就目前而言，它们只是显示在彼此的下方。

编辑：我尝试使用 row 但这也不起作用

  <div class="row">
    <div class="col-md-6">
        @Html.DropDownList("Member", ladder.SignupSheet.GroupMembers, new {label = "Members", @class = "pull-left form-control", @style = "width:200px"})
    </div>    
    <div class="col-md-6">
        @Html.SubmitButton("Add member", true, new {@class = "btn btn-primary"})
    </div>
</div>

Answer 1

bootstrap 有输入组，用于组合您可能想要尝试的输入和按钮

<div class="input-group">
  @Html.DropDownList("Member", tournament.SignupSheet.GroupMembers)
  <div class="input-group-btn">
    @Html.SubmitButton("Add", true, new { @class = "btn btn-primary" })
  </div>
</div>