我正在尝试将下拉菜单与中心对齐,我正在使用 Bootstrap 4。
我正在关注这个例子:
[![示例下拉菜单]](https://i.stack.imgur.com/nImrY.png)
这就是我得到的:
[![我的情况]](https://i.stack.imgur.com/yLZJB.png)
这是我的代码:
<div class="container">
<div class="row">
<div class="col-md pl-4 user-dropdown text-center">
<div class="dropdown btn-group">
<a class="navbar-brand dropdown-toggle" href="#" id="bd-versions" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fas fa-user"></i></a>
<ul class="dropdown-menu">
<li>
<a href="{{ route('logout') }}" onclick="event.preventDefault(); document.getElementById('frm-logout').submit();">
Logout
</a>
<form id="frm-logout" action="{{ route('logout') }}" method="POST" style="display: none;">
{{ csrf_field() }}
</form>
<hr>
</li>
<li><a href="{{ route('user.profile') }}">My Profile</a></li>
</ul>
</div>
</div>
<div class="col-md">
<span><a class="navbar-brand" href="#"><i class="fas fa-shopping-cart"></i></a></span>
</div>
<div class="col-md">
<span><a class="navbar-brand" href="#"><i class="fas fa-heart"></i></a></span>
</div>
</div> …Run Code Online (Sandbox Code Playgroud)