css - 导航栏中的列显示不在全宽容器中

Question

我想在我的页面上添加一个粘性标题，bootstrap 为其提供了一个类，我还添加了一个容器来使内容居中并使其与下面的内容一样宽。

但是当我添加一行和 12 列时，并没有占用容器的整个宽度，请参见下面的代码。

<nav class="navbar fixed-top navbar-light sticky-header">
      <div class="container sticky-header-container">
          <div class="row">
              <div class="col-md-3">test3
              </div>
              <div class="col-md-6">test2
              </div>
              <div class="col-md-3">test3
              </div>                    
          </div>
      </div>
</nav>

Answer 1

您可以像这样向您的行添加一个类:

编辑:正如 ZimSystem 指出的那样， Bootstrap 中有一个 w-100 类，所以就这样做:

<div class="row w-100">
   Your Elements
</div>

这应该让您获得 100% 的容器宽度。

工作样本:https://www.bootply.com/J5gKTedgPr