当涉及到嵌套网格时，有没有办法让流体 960 网格系统的行为方式与固定宽度的 960 网格系统相同？答案

【问题标题】：Is there a way to have a fluid 960 grid system behave in the same way as a fixed width 960 grid system when it comes to nested grids?当涉及到嵌套网格时，有没有办法让流体 960 网格系统的行为方式与固定宽度的 960 网格系统相同？
【发布时间】：2014-02-22 05:17:06
【问题描述】：

我公司的网站目前使用的是固定宽度的 960 网格系统。一直在谈论转向流体设计，所以我一直在研究流体 960 网格系统。

据我所知，这两个系统的行为方式相似，直到您拥有嵌套网格。例如在固定宽度系统中：

<div class="grid_12">
    <div class="grid_6">
        <div class="grid_6">
            <p>This paragraph will fill up half the space of the grid_12 div in a 12 column grid.</p>
        </div>
    </div>
</div>

我对流体 960 网格系统（以及百分比）的理解是这样的：

<div class="grid_12">
    <div class="grid_6">
        <div class="grid_6">
            <p>This paragraph will only fill up a quarter the space of the grid_12 div in a 12 column grid, at least as far as I can tell.</p>
        </div>
    </div>
</div>

现在，我明白了，如果我将上面代码中最里面的 div 更改为 grid_12，它的工作原理与第一个示例相同，但该网站有很多页面，虽然我可以遍历并更改每个嵌套实例相应的网格，这将需要相当长的时间（特别是因为大部分页面都是在我被录用之前编写的）。

那么，有没有办法让嵌套在流体网格系统中的工作方式与固定宽度相同，而无需逐页更改任何内容？

我怀疑答案是否定的，但我想如果有什么我没有想到的方法，那么 SO 上的某个人会知道。

【问题讨论】：

标签： html css 960.gs

【解决方案1】：

根据您的实际布局有多复杂，您可以尝试执行类似的操作

.grid_6 .grid_6 { width: 100% }

等等

ofc，您至少需要为网站上的每种情况添加这些类型的选择器，但我不会真正推荐它，因为它更多的是一种解决方法而不是一个好的解决方案。

也许尝试找到更适合新规范的新网格/布局解决方案？

【讨论】：

一个新的解决方案可能是最好的主意，虽然我不得不承认我没有想到 CSS 解决方法。