让 Bootstrap 网格系统列在浏览器调整大小时保持固定宽度答案

【问题标题】：Getting Bootstrap grid system columns to remain fixed width on browser resize让 Bootstrap 网格系统列在浏览器调整大小时保持固定宽度
【发布时间】：2013-06-07 16:30:39
【问题描述】：

正如标题所说，我正在使用 twitter Bootstrap CSS 脚手架系统来设置使用流体网格系统的列。我希望这些列在调整浏览器大小时保持固定宽度（当浏览器缩小时，这些列中的内容会“平滑”在一起）。我该怎么做？这是我正在使用的基本代码：

<div class="container-fluid">
    <div class="row-fluid">
        <div class="span2">
        </div>
        <div class="span4" style="background-color: white;">
        </div>
        <div class="span4" style="background-color: white;">
            <div class="row-fluid">
                <div class="span6">
                </div>
                <div class="span6">
                </div>
            </div>
        </div>
        <div class="span2">
        </div>
    </div>
</div>

【问题讨论】：

澄清一下，您想要一个流体容器但固定列宽？如果是这样，您可能想尝试display: inline-block
请注意，引导程序可能有各种可能会干扰的样式。浮动、流体容器...等。您可能希望避免主布局的 twitter 引导程序。也许先做一个网站骨架，然后再整合引导样式。
这并没有解决问题。我希望列在调整浏览器大小时保持相同的像素大小。
实际上，这是内联块的一个很好的用例。这是我制作的fiddle：你可以试试。花车也可以工作。这是good overview。

标签： css twitter-bootstrap

【解决方案1】：

我相信你应该改变 div 的位置，你想保持固定，绝对或固定。

【讨论】：

【解决方案2】：

也许您想用流体容器固定一些列？如果是这样，你可以试试这个：https://stackoverflow.com/a/22471138/1252528

更新：我认为您不需要使用引导程序进行布局，只需将 display: table 添加到容器 div 并将 display: table-cell 添加到要设置固定宽度的 span 元素即可存档。

【讨论】：

仅供参考，无法回答，因为它只是指向现有 SO 线程的链接。
@PareshMayani，是的，也许这个问题是重复的。