防止引导程序 3 重置嵌套网格/使用主网格答案

【问题标题】：Prevent bootstrap 3 from resetting nested grids / use master grid防止引导程序 3 重置嵌套网格/使用主网格
【发布时间】：2014-01-25 10:29:37
【问题描述】：

有没有办法让 Bootstrap 3 只使用我的外部网格列？

例如，我已将 Bootstrap 构建为使用 10 列而不是 12 列。我将布局划分为左侧 2 列 div 和右侧 8 列 div。

我的主要内容放在右边。我想将主要内容分成四个相等的列，应该只是四个 .col-md-2 元素。然而，当我将 .col 元素放入正确的 div 时，Bootstrap 想要将网格重置回 10。

帮助？

【问题讨论】：

这个问题很可能是因为当你需要使用 col-~~-2 时，你试图使用 col-~~-2 将你的主要内容（在 col-~~-8 内）除以 4 ~~-3。你能发布一些你的标记吗？

标签： html css twitter-bootstrap twitter-bootstrap-3

【解决方案1】：

好吧，外列是 8 和 2 = 10，但你希望 4 在主要内容中相等，应该等于 10，但是你有 col-md-2 x 4 = 8 所以你不能这样做你需要在该主要内容中将其添加到 10。您需要使用宽度为 25% 的列，如果您正确转换为使用 10 列，那么它可能是 col-md-4。

您需要发布 fiddle 或 bootply 以获得更好的答案。或者切换回 12 列并在 LESS 中调整这些列的宽度（不那么痛苦）。

【讨论】：

是的，这是我的问题：是否有可能让引导程序仅使用外部容器作为网格宽度，基本上“记住”我的右 div 是 8 宽，所以我可以将它平均分成 4 列?或者引导程序总是将嵌套的 div 重置为定义的 10 列？
所有网格都以这种方式工作，任何东西的宽度都是 100%，所以你坚持一个 2 col 布局，然后如果你嵌套这些列中的任何一列，那么它会回到 100%，所以你重新开始。
谢谢，我就是这么想的：/

【解决方案2】：

我遇到了和你一样的问题，刚刚回答了一个类似的问题——我认为用 Bootstrap 本身是没有办法的，因为网格系统都是 CSS。但是，我编写了一段 Javascript 来根据嵌套级别计算百分比 - 它似乎在这里工作正常。这是要点： https://gist.github.com/royalsflush/8422780

这是带有脚本的 bootply：http://bootply.com/105852

【讨论】：

【解决方案3】：

尝试使用没有网格系统的自定义引导程序，您可以通过取消选中“网格系统”并在页面末尾下载自定义内容来获取它。

http://getbootstrap.com/customize/

【讨论】：