角度项目中的水平中心引导4按钮工具栏

Question

我想做的就是将dang按钮工具栏水平居中。到目前为止，我所拥有的只是：

<div class="row">
  <div class="col-sm-6 mx-auto">
    <div class="btn-toolbar" role="toolbar" aria-label="Toolbar with button groups">
      <div class="btn-group mr-2" role="group" aria-label="First group">
        <button type="button" class="btn btn-secondary">Sign Up</button>
      </div>
      <div class="btn-group mr-2" role="group" aria-label="Second group">
        <button type="button" class="btn btn-secondary">Forgot Password?</button>
      </div>
    </div>
  </div>
</div>

附件是它的外观图像。好像应该有一些我可以添加的boostrap类来使它工作。

Answer 1

你试过了吗？

<div class="row justify-content-center">
    .
    .
    .
</div>

您可以在此处查看几种根据需要调整内容的方法：https://getbootstrap.com/docs/4.0/layout/grid/

Answer 2

您可以将此CSS规则应用于btn-toolbar类

.btn-toolbar{
    text-align: center !important;
    display: Block !important;
}

.btn-toolbar{
  text-align: center !important;
  display: Block !important;
}

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">

<div class="row">
  <div class="col-sm-6 mx-auto">
    <div class="btn-toolbar" role="toolbar" aria-label="Toolbar with button groups">
      <div class="btn-group mr-2" role="group" aria-label="First group">
        <button type="button" class="btn btn-secondary">Sign Up</button>
      </div>
      <div class="btn-group mr-2" role="group" aria-label="Second group">
        <button type="button" class="btn btn-secondary">Forgot Password?</button>
      </div>
    </div>
  </div>
</div>