emu*_*lk1 4 twitter-bootstrap-4 bootstrap-4
我正在尝试创建一个标签菜单,该标签菜单位于菜单nav-item dropdown的最右边。
Bootstrap 4 alpha 5,float-xs-right及其工作原理:http://codeply.com/go/FCFPpRqhZd
Bootstrap 4 alpha 6,我更改为float-right但无法正常工作:http://codeply.com/go/5mddDUv1M6
有想法吗
Zim*_*Zim 11
由于Alpha 6现在是flexbox,float因此在这种情况下将不再起作用。
使用ml-auto实用程序类代替margin-left:auto
<div class="col-md-12">
<ul class="nav nav-tabs">
<li class="nav-item">
<a href="#" class="nav-link active">Link 1</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">Link 2</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">Link 3</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link">Link 4</a>
</li>
<li class="nav-item dropdown ml-auto">
<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">Account</a>
<div class="dropdown-menu">
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<a class="dropdown-item" href="#">Something else here</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Separated link</a>
</div>
</li>
</ul>
</div>
Run Code Online (Sandbox Code Playgroud)
http://www.codeply.com/go/hhV1aM49zz