使用blueprint CSS，是否可以做如下布局答案

【问题标题】：Using blueprint CSS, is it possible to do the following layout使用blueprint CSS，是否可以做如下布局
【发布时间】：2011-03-13 13:15:58
【问题描述】：

我想使用蓝图 css 做以下布局

Page Width = 960px

<- 20px -> <------- 600px -------> <- 20px -> <--- 300px ---> <- 20px ->
   left           main content       middle      right rail     right
  gutter                             gutter      (ad unit)      gutter

适当的列宽、边距宽度和列数可以使这项工作发挥作用？

我正在尝试使用 10px 列和 10px 边距来执行此操作，但最终以 30px 作为中间装订线（一整列 + 右侧边距）

【问题讨论】：

标签： css blueprint-css

【解决方案1】：

开箱即用，不。但是您可以尝试使用 Blueprint CSS 定制器，例如：

这些基本上采用默认蓝图 CSS 文件，重新计算所有数字，并为您生成新版本的蓝图 CSS 框架。

【讨论】：

另一个基于蓝图的布局工具：pageblox.com

【解决方案2】：

可以做如下布局吗？

没有。并非没有重新设计整个框架。

蓝图 CSS 使用：950 像素宽度、10 像素间距和从 30 像素开始并以 40 像素为增量增加的列。所以：600px 会变成 590px，300px 会变成 310px。

您可以调整整个框架，调整每个组件的尺寸...

或者，您可以将列调整为以下之一：（30、70、110、150、190、230、270、310、350、390、430、470、510、550、590、630、670、 710, 750, 790, 830, 870, 910) 像素...

或者，您可以试试960 Grid System。它使用 20 像素的装订线、960 像素的页面宽度和 40 或 60 像素的列增量。它没有漂亮的、固定的排版设置。而且我不确定它是否也适用，跨浏览器和跨媒体。

总体布局资源：http://layouts.ironmyers.com/

【讨论】：

这是我经过数小时尝试后得出的结论。 960.gs 也不是真的工作——它基本上是一个 950px 宽度的页面，两边有 5px 的装订线。似乎可行的是使用 Compass (compass-style.org)，它使用 SASS，实现蓝图框架并允许 .5 列之类的东西。