css - bootstrap :Firefox无法正确放置宽度超过767px的表格

我已经创建了一个带有选项卡的Bootstrap导航栏的简单网站。每个选项卡都显示一个表格。 （请参见here。）

在Windows 8.1上的Chrome 45和IE 11中，此功能正常运行。

但是，在Firefox中，如果窗口宽度大于767px，则表将直接放在导航栏上。

<div id="content">
<ul class="nav nav-pills nav-tabs nav-justified navbar-header">
    <li class="active"> <a href="#">Tab 1</a>
    </li>
    <li> <a href="#">Tab 2 </a>
    </li>
</ul>
<div>
    <h1>test</h1>
    <table class="table table-bordered table-striped table-responsive" id="azubiTable">
        <thead>
            <tr id="head">
                <th>1st col</th>
                <th>2nd col</th>
                <th>3rd col</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>1.1</td>
                <td>2.1</td>
                <td>3.1</td>
            </tr>
            <tr>
                <td>1.2</td>
                <td>2.2</td>
                <td>3.2</td>
            </tr>
        </tbody>
    </table>
</div>

最佳答案

我最好的解释是，这是一个浮动清算问题，在FF中无法正常工作。

如果将clear:both添加到保存该表的div中，它将在FF中工作。