Negate margins with no-gutters alternative

[samusgray]

Hey there,

The no-gutters argument is nice for preventing a mixin from adding gutters, but I find it is often useful to remove gutters by setting margins to 0. Here is an example use case:

Current method:

.selector {
  @include span(3 of 12);
  @media screen and (max-width: 10em) {
    @include span(6 of 12);
      margin-right: 0; // To remove margins set by span.
    }
}

Option One

.selector {
  @include span(3 of 12);
  @media screen and (max-width: 10em) {
    @include span(6 of 12 drop-gutters); // Set flow margins to zero.
    }
}

Option Two

.selector {
  @include span(3 of 12);
  @media screen and (max-width: 10em) {
    @include span(6 of 12 0); 
    // If columns are specified as zero, 
    // then output margin-{$flow}: 0.
    }
}

Currently Susy simply doesn't output margins if 0 is passed as the column argument.

Option one is backwards compatible, but option two may be the most intuitive. Thoughts?

[mirisuzanne]

I don't like option 2, because it's messing with the grid math, not just the output. We need a solution that changes the output without changing the way grids are calculated.

My immediate thought is to have two keywords: null-gutters (works like the current feature) and zero-gutters (sets your gutters to 0, overriding anything previous).

no-gutters would continue to work for now, as it does, but be removed from documentation, and deprecated in the next major release.

[samusgray]

+1 The verbiage and deprecation process both sound great, but why not just keep no-gutters documented as is and include zero-gutters?

[mirisuzanne]

Yeah. Why not that? You're probably right. :)