JohnAlbin/compass-zen-grids — pull request #10 by jstoller (2012-03-26 07:24:29+00:00)
Title: Customizable outer grid margin

I've added a new variable, `$zen-margin-width`, that controls the outer margin on the left and right sides of the grid. This variable defaults to half the gutter width, mimicking Zen Grid's current behavior. However, the new variable is able to accept one or two values. If two values are provided, then the first will set the margin on the float direction side of the grid and the second value will set the margin on the reverse side. So, in a default configuration, `$zen-margin-width: 20px 50px;` would result in a left margin of 20px and a right margin of 50px within the grid container.

To achieve this, I remove the padding from the outside edges of the first and last column in a grid row and instead add the grid margin as padding on the grid container. This has the added benefit of ensuring that the outside columns end on grid boundaries and don't intrude into the margins of the layout. For instance, including the grid margins within the columns themselves makes it very difficult to set a background color for the grid. With this updated feature, I can now easily include an inner wrapper div within my grid container and set the background on that.