使用蓝图CSS，可以执行以下布局

Question

我想使用blueprint css

进行以下布局

Page Width = 960px

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

使这个有效的列宽，边距宽度和列数是多少？

我试图用10px列和10px边距来做到这一点，但它最终以30px作为中间装订线（一个完整的列+右边的边距）

Answer 1

  

是否可以进行以下布局？

没有。并非没有改造整个框架。

蓝图CSS使用：950px宽度，10px装订线以及以30px开始并以40px为增量增加的列。所以：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。它使用20px排水沟，960px页面宽度和40或60px列增量。它没有漂亮的罐装排版设置。而且我不确定它是否也能保持，跨浏览器和跨媒体。

常规布局资源：http://layouts.ironmyers.com/

Answer 2

开箱即用，没有。但您可以尝试使用Blueprint CSS自定义程序，例如：

• Blueprinter
• Blueprint Grid CSS Generator

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