Not understanding how Susy calculates widths

Question

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.

Answer 1

If Susy output width: 60px; and then added 12px padding inside (for 24px gutters), your actual column-width would only be 36px. In order t give you full 60px columns and 24px gutters, The width needs to be set to 84px.