Используя blueprint CSS, возможно ли сделать следующий макет

Question

Я хотел бы сделать следующий макет, используя план CSS

Page Width = 960px

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

Какова будет подходящая ширина столбца, margin-width и количество столбцов, чтобы эта работа работала?

Я пытаюсь сделать это со столбцами 10px и полем 10px, но в итоге получается 30px в качестве среднего желоба (один полный столбец + поле справа)

Answer 1

Возможно ли сделать следующий макет?

Нет. Не без переделки всей структуры.

Blueprint 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. У этого нет хороших, консервированных настроек типографии. И я не уверен, что это так, кросс-браузер и кросс-медиа.

Ресурс General Layout: http://layouts.ironmyers.com/

Answer 2

Из коробки нет. Но вы можете поэкспериментировать с настройками Blueprint CSS, например:

• Blueprinter
• Blueprint Grid CSS Generator

По сути, они берут CSS-файлы Blueprint по умолчанию, пересчитывают все числа и выдают новую версию CSS-схемы Blueprint.