0

I'm not understanding how Susy calculates widths for it's grids. I have a 9 column grid which is nested inside a 12 grid column and the widths aren't calculated as I would expect them to be. Here are my settings:

$susy: (
    columns: 12,
    column-width: 60px,
    gutters: 2/5,
    math: static,
    global-box-sizing: border-box
);

So my main column has @include span(last 9 nest);. So inside that 9 column grid cell if I create another cell using @include span(1 of 9 inside); shouldn't the output css be:

{
    width: 60px;
    padding: 0 12px;
}

Instead what I'm getting is:

{
    width: 84px;
    padding: 0 12px;
}

What I want is the total column width to be 60 pixels, which is what I expect a single column width to be, and then add padding on the left and right. Is there a way to tell Susy not to add the width to the column width? Also I using padding instead of margin because I need the columns to be flush with each other.

Here's a screenshot of what the grid needs to look like. enter image description here

4

1 回答 1

1

如果 Susy 输出width: 60px;然后12px在内部添加填充(用于24px装订线),则您的实际列宽仅为36px. 为了给你完整的60px列和24px装订线,宽度需要设置为84px.

于 2014-05-26T18:02:44.073 回答