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