O'Reilly logo

Mastering Sass by Luke Watts

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

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 ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required