html - Bootstrap 列不响应/不流畅

Question

我是第一次使用 Bootstrap CSS 网格系统，我注意到在 Google Chrome 中，当我调整窗口大小时(从小到大)，设计响应灵敏且流畅，Divs 保持其比例大小。在 Mozilla Firefox 中情况并非如此，尽管 class="container-fluid" Div 会随着调整大小而拉伸(stretch)行类 div 中的 Div 保持它们的小尺寸(它们没有任何更大，不要拉伸(stretch))。我尝试在 .col-xs-* 类之后添加 .col-sm-* 但这没有效果/没有区别(请参阅代码中的注释)。我犯了一个愚蠢的错误吗？在我浏览 Bootstrap 文档时，任何人都可以回答我的问题吗？

<header>
    <div class="container-fluid header">
        <div class="row">
            <div class="col-xs-2">&#9776;</div>
            <div class="col-xs-8 text-center">
                <img src="../img/some-image.png" alt="Some Image">
                <span class="strapline">Nice Strap line</span>
            </div>
            <div class="col-xs-2 col-sm-2 text-right"> + </div>
        </div>
    </div>

    <div class="container-fluid search">
        <div class="row">
            <div class="col-xs-3"></div>
            <div class="col-xs-6 text-center"></div>
            <div class="col-xs-3 text-right"></div>
        </div>
    </div>

    <!--col-sm-* added here... -->
    <div class="container-fluid filter-menu">
        <div class="row">
            <div class="col-xs-4 col-sm-4 filter-buttons">
                Menu Button 1
                <span class="filter-green">12.03.14, 12:30</span>
            </div>
            <div class="col-xs-4 col-sm-4 filter-buttons">
                Menu Filter
                <span class="green-count">1</span>
            </div>
            <div class="col-xs-4 col-sm-4 filter-buttons-last">
                Sort By
                <span class="filter-green">Rating</span>
            </div>
        </div>
    </div>
</header>

请注意 .filter-green、filter-buttons、.filter-menu、.text-center、.text-right、.header 和 .search我生成的自定义 CSS 类，这些类与 Bootstrap Grid 没有任何冲突

更新**

请注意，我认为我可能必须使用 .row-fluid 类并使列具有相同的高度 我在以下 Bootstrap 类上添加了以下覆盖

  // bootstrap overwrite...
  .row {
    display: table;
  }

  [class*="col-"] {
    // float: none;
    display: table-cell;
    vertical-align: top;
  }

Answer 1

我刚开始使用 .row-fluid 类而不是 .row 并且我删除了上面的 clearfix 覆盖。问题解决了!