Bootstrap 4：col align right

Question

我试图创建一个2列的行。左边一列，内容左对齐，第二列右边内容对齐（旧右拉）。

如何在alpha-6中执行此操作？

我试过一些东西，但这是我迄今为止。我错过了什么？

<div class="row"> 
    <div class="col">left</div> 
    <div class="col ml-auto">content needs to be right aligned</div> 
</div> 

Answer 1

使用float-right块元素，或text-right内联元素：

<div class="row"> 
    <div class="col">left</div> 
    <div class="col text-right">inline content needs to be right aligned</div> 
</div> 
<div class="row"> 
     <div class="col">left</div> 
     <div class="col"> 
      <div class="float-right">element needs to be right aligned</div> 
     </div> 
</div> 

http://www.codeply.com/go/oPTBdCw1JV

如果float-right不能正常工作，记得引导4是现在flexbox，还有很多元素为display:flex，这可以防止float-right工作。

在一些情况下，实用程序类等align-self-end或ml-auto工作右对齐是像引导4 .row，卡或NaV的Flexbox的容器内的元件。在flexbox元素中使用ml-auto（margin-left：auto）将元素向右推。

Bootstrap 4 align right examples

Answer 2

从文档，你做这样：

<div class="row"> 
    <div class="col-md-6">left</div> 
    <div class="col-md-push-6">content needs to be right aligned</div> 
</div> 

Docs