Question

出于某种原因，bootstrap只允许我使用＆＃34; col-sm＆＃34;类。如果我在我的代码中输入任何其他内容，包括＆＃34; xs＆＃34;类，列彼此堆叠在一起。这是我的代码：

    <div class="container-fluid">
            <div class="row">
                <div class="col-xs-9">
                    <div class="well">something here</div>
                </div>
                <div class="col-xs-3">
                    <div class="well">something here</div>
                </div>
            </div>
        </div>

我已经确保链接了适当的CSS，JS和jQuery文件（因此＆＃34; col-sm＆＃34;类的工作原理），并且只有我自己的个人CSS样式表链接它们（不预定任何元素的任何宽度或高度）。此外，我正在查看我在最新版本的Mozilla Firefox上的工作。

编辑：我已经用类＆＃34;流体容器＆＃34;关闭了div，它仍然会产生同样的问题。也就是说，不是出现在同一行上的两列，而是将两列堆叠在一起。出于某种原因，唯一有效的课程是＆＃34; col-sm＆＃34; - 任何其他课程，包括＆＃34; xs＆＃34;，只是将列彼此排列在一起。

Answer 1

你的代码是正确的，只有你错过的是最后一个'＆gt;'关闭div标签。替换：

<div class="container-fluid"

使用：

<div class="container-fluid">

Answer 2

请先修复您的div $ git rebase -i HEAD~8 <div class="container-fluid" 见下面更正的格式

Answer 3

使用最新稳定版3.7.7的bootstrap，这个问题就解决了。您可以从here下载。如果您不想使用最新版本，可以尝试使用col-sm-9代替col-xs-9和col-sm-3代替col-xs-3，它也可以解决问题

网格系统无法正常工作

3 个答案: