如何将hr分频器居中（在bootstrap 4中）

Question

我如何使hr分频器居中？由于某种原因，尽管使用了文本中心引导程序类，它仍然保持对齐状态。居中前后的文字！ 您可以在这里看到它：http://www.mokado.pl/index.html#about

<section class="about page-section bg-primary" id="about">
      <div class="container">
        <div class="row justify-content-left">
          <div class="text col-lg-4 text-center">
            <h2 class="text-white mt-0">Mokado</h2>
            <hr class="divider light my-4 text-center" />
            <p class="text-white mb-4">
              Ideą marki Mokado jest połączenie estetyki i komfortu... 
            </p>
            <!-- <a class="btn btn-light btn-xl js-scroll-trigger" href="#services"
              >Get Started!</a
            > -->
          </div>
        </div>
      </div>
    </section>

Answer 1

将此CSS添加到您的hr标记

hr {
   margin: 0 auto;
}

或者，如果您不想编写CSS，也可以使用mx-auto类

Answer 2

您似乎拥有CSS样式，覆盖了bootstarp。

在样式表的末尾添加此内容。

此行已经存在margin-top: 1.5rem !important;

我添加了这两个。

margin-left: auto;

margin-right: auto;

.mt-4, .my-4 {
    margin-top: 1.5rem !important;
    margin-left: auto;
    margin-right: auto;
}

查看屏幕快照。

当我使用上面提供的代码时，我也会看到它居中。