gutter() not changing with parameters

[jklue]

Thanks for the awesome toolkit. There must be something strange with my setup because I get no difference between the following 4 code snippets:
padding-left: gutter(); // output 2.85714%
padding-left: gutter(3); // output 2.85714%
padding-left: gutter(of 12); // output 2.85714%
padding-left: gutter(of 6); // output 2.85714%
Have you seen this issue before? How do I troubleshoot this? Thank you!
I'm using susy 3.0.1.

[mirisuzanne]

I haven't seen that, no. Can you paste your $susy configuration variable as well?

[jklue]

Thanks! This is what I have:

$susy: (
  'columns': susy-repeat(12),
  'gutters': percentage(40/1400),
  'spread': 'narrow',
  'container-spread': 'wide',
  'svg-grid-colors': transparentize($blue, 0.95)
);

and the div I'm testing on:

.susy-nesting-tester {
    flex: 0 0 span(1 of 3 wide);
    padding-left: gutter(); // testing
    padding-left: gutter(3); // testing
    padding-left: gutter(of 12); // testing
    padding-left: gutter(of 6); // testing
}

[mirisuzanne]

Yeah, 2.85714% is the result of percentage(40/1400). Even though the output is fluid (%) - your gutters are set explicitly, and not as a ratio to columns. In order to get fluid output that adjusts to column-context, you'll need a unit-less number that is a fraction of 1 column. Something like:

$susy: (
  'columns': susy-repeat(12),
  'gutters': (40/100),
);

So that's two changes from what you have:

• Remove the percentage function, so Susy can calculate % based on columns.
• Change the fraction to represent gutter/column rather than gutter/container.

(The parenthesis help certain versions of Sass understand the division problem.)

[jklue]

Thank you so much!! I'll move forward with this.