将 960 网格布局设置为 100% 高度

【问题标题】：Getting 960 grid layout to 100% height将 960 网格布局设置为 100% 高度
【发布时间】：2011-08-21 21:18:32
【问题描述】：

我正在使用 960 CSS 网格布局进行布局，并且在让我的内容 div 一直延伸到底部时遇到了一些问题，无论内容有多少。

我在 html 和 body 标签上都有 height: 100% 。通常，内容 div 上的 min-height: 100% 会起作用，但 960 网格似乎并非如此。

有什么想法吗？

【问题讨论】：

您是否使用 FireBug 或任何工具检查您设置的任何值是否被 960.gs 样式表覆盖？
是的。现在我已经设法让我的 div.container_12 使用 min-height: 100% 达到全高。但是它的内容仍然没有拉伸整个高度。

标签： css 960.gs

【解决方案1】：

不确定这个答案是否仍然需要回答，但我今天在处理 wordpress 模板时遇到了同样的问题并解决了这个问题。

您需要做的是在网格提供的 container_12 或 container_16 之前制作一个包装器。您根本不需要 html 或 body 等于 height: 100% 。您甚至不需要包装器的最小高度。

确保您的包装器没有设置高度或宽度，并将 clearfix 放在 container_12 或 container_16 上，它应该一直向下扩展。

我的 wordpress 模板上有这个功能。

  <div id="yourwrapper">
    <div class="container_12 clearfix">
      <div class="grid_12">

       <!-- YOUR CONTENT SHOULD BE COMPLETELY WRAPPED BY THE WRAPPER -->          

      </div>
      </div>
      </div>

【讨论】：