How to set Susy gutter width to be more than 1 column

Question

I'm using with-layout to temporarily set defaults for my page column structure. I need a 24 column grid to allow finer control, but need a gutter that's larger than 1 column. Is that possible?

@include with-layout(24) {
    .col-1 {
        @include span(17);
    }
    .col-2 {
        @include span(7);
    }
}

So something like @include with-layout(24 2col-gutter) { ... }

Answer 1

I realised that if you want the gutter to be a multiple of the column width (1 col, 2 col etc) then you can just use the pre and push options.

In my case I actually wanted the gutter to be twice the width of the column so this worked perfectly.

$susy: (
  columns: 24,
  gutters: 0
);

.col-1 {
  @include span(17);
}

.col-2 {
  @include span(5);
}

.col-1 + .col-2 {
  @include pre(2);
}

Demo