Mastering Sass

The $susy configuration map

Right now, we're mostly using the default settings of Susy. However, Susy allows for a lot of configuration through its configuration map, which is called $susy. The settings in the $susy map allow us to set how wide the container should be, how many columns our grid should have, how wide the gutters are, whether those gutters should be margins or padding, and whether the gutters should be on the left, right, or both sides of each column. Actually, there are even more settings available depending on the type of grid you'd like to build.

Let's define our $susy  map with the container set to 1160px in scss/style.scss in place of our $grid  map:

$susy: ( 
    container: 1160px 
); 

Now we can go back to our scss/layout/_grid.scss ...