Bootstrap 列在 Firefox 中未正确显示

Question

我的 Bootstrap 网格在 Safari 和 Chrome 中工作正常，但在 Mozilla Firefox 中却没有。当我稍微最小化它时它工作正常，但不是在填充屏幕尺寸上。

<div class="container-fluid">
  <div class="row">
    <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 col-xl-8">
      <div class="container">
        <div class="row">
          <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 col-xl-6">
            1
          </div>
          <div class="col-xs-12 col-sm-6 col-md-6 col-lg-6 col-xl-6">
            2
          </div>
          <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
            3
          </div>
        </div>
      </div>
    </div>
    <div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 col-xl-4">
      <div class="container">
        <div class="row">
          <div class="col-xs-12 col-sm-4 col-md-12 col-lg-12 col-xl-12">
            a
          </div>
          <div class="col-xs-12 col-sm-4 col-md-12 col-lg-12 col-xl-12">
            b
          </div>
          <div class="single-offer col-xs-12 col-sm-4 col-md-12 col-lg-12 col-xl-12">
            c
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

你知道为什么会发生这种情况吗？

Answer 1

事实证明，这根本不是关于这部分的。问题是上面的一行有 1px 的可用空间，所以 Firefox 试图把这部分塞进那一行，这把它搞砸了。

解决方案：

.container-fluid>.row {clear:both}

误导大家见谅。