如何在引导中对齐右边的按钮

Question

如何将按钮对齐到正在应用justify-content-center类的div中的左侧。密码-

<div class="card-header justify-content-center">
 <div>
 <div class="ml-5">
 Text in Center
 </div>
<div class="float-right"><button>Button on right</button></div>
 </div>
</div>

float-right没有工作，因为justify-content-center --我试着把justify-content-center放在单独的div上，但是文本没有中心。

密码-

<div class="card-header">
  <div class="justify-content-center">
   <div class="ml-5">
    Text in Center
   </div>
  <div class="justify-content-end"><button>Button on right</button></div>
 </div>
</div>

这种方法是行不通的。如果我把justify-content-center类放在其他的div上，我不知道为什么文本不在中间。

Answer 1

调整-内容-结束只在父标记上工作。你试过用ml-auto代替吗？

更多信息：https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content

Answer 2

请尝试以下代码：

<div class="card-header justify-content-center">
 <div>
  <div class="ml-5 text-center">
   Text in Center
  </div>
  <div class="d-flex justify-content-end"><button>Button on right</button></div>
</div>