如何使c# Dropdownlist和提交按钮与引导一行吗?

Question

<div class="d-flex flex-row" >
@using (Html.BeginForm())
{
<div class="p-2">
@Html.DropDownList("id", ((SelectList)ViewBag.ProjectName), "- Select project -", new { @class = "form-select" })
</div>
<div class="p-2">
<input type="submit" value="Choose this project" asp-action="ViewTickets" />
</div>
}
</div>

现在下拉列表在提交按钮上方。所以，我试着用div来包装这两个元素，但没有任何帮助。我想要下拉列表和按钮并排在一行。

Answer 1

正如Caius Jard所说，您想要查看Bootstrap网格系统(https://getbootstrap.com/docs/4.0/layout/grid/)。有用于行和列的类，可以让您完成您想要做的事情。下面的代码应该适用于这种特殊情况。

<div class="row">
<div class="col-md">
@Html.DropDownList("id", ((SelectList)ViewBag.ProjectName), "- Select project -", new { @class = "form-select" })
</div>
<div class="col-md">
<input type="submit" value="Choose this project" asp-action="ViewTickets" />
</div>
</div>