如何使用bootstrap将div向右对齐

Question

我有一个layout_cshtml，现在我的挑战是在左边的div上对齐，并且不能很好地显示搜索和下拉列表。我需要一些以下的逻辑帮助，它没有很好地对齐，但对用户体验不好，包括我的导航根本没有显示在界面上，没有任何错误，请根据我的尝试帮助我。

//View
<nav>
<ul class="nav">
<li><a href="@Url.Action("People")">People</a></li>
<li><a href="@Url.Action("Modules")">Modules</a></li>
<li>
<a href="@Url.Action("Files")"></a>
<ul class="sub-menu">
<li><a href="@Url.Action("Files")">Files</a></li>

</ul>
</li>
</ul>
</nav>

<center>
<div class="form-group row">
<li class="static ui-state-default ui-corner-top ui-tabs-active ui-state-active" role="tab" tabindex="0" aria-controls="tab-0" aria-labelledby="ui-id-1" aria-selected="true">
<a href="#tab-0" class="ui-tabs-anchor" role="presentation" tabindex="-1" id="ui-id-1">Everyone</a>
</li>
<form class="form-group ml-3">
<div class="input-group input-group-sm">
<input class="form-control form-control-navbar" type="search" placeholder="Search" aria-label="Search">
<div class="input-group-append">
<button class="btn btn-navbar" type="submit">
<i class="fas fa-search"></i>
</button>
</div>
</div>
</form>
<!--DropdownlistFor-->
@Html.DropDownList("eNtsaRegLists", new SelectList(ViewBag.eNtsaRegListsEnum, "Value", "Text"))
</div>
</center>

Answer 1

我不确定你想要移动什么<div>，当你没有div时，我也不明白添加<nav>的意义。

无论如何，这里有一个关于如何做到这一点的例子。我在bootstrap中使用了float类(https://getbootstrap.com/docs/4.0/utilities/float/)

<div class="form-group row float-right">
<li class="static ui-state-default ui-corner-top ui-tabs-active ui-state-active" role="tab" tabindex="0" aria-controls="tab-0" aria-labelledby="ui-id-1" aria-selected="true">
<a href="#tab-0" class="ui-tabs-anchor" role="presentation" tabindex="-1" id="ui-id-1">Everyone</a>
</li>
<form class="form-group ml-3">
<div class="input-group input-group-sm">
<input class="form-control form-control-navbar" type="search" placeholder="Search" aria-label="Search">
<div class="input-group-append">
<button class="btn btn-navbar" type="submit">
<i class="fas fa-search"></i>
</button>
</div>
</div>
</form>
</div>

代码笔：https://codepen.io/cbrown___/pen/yLOqNym

顺便说一句，你应该写代码笔，而不是我们，你想从谁那里得到帮助。

编辑：删除<center>