Creating an entirely fluid grid

While Susy creates an elastic grid (that flexes to a point and then become fixed) by default, it can easily convert a grid to be fully fluid (in which it completely and proportionally fills all the available space). This can be achieved by adding this variable below the existing grid settings:

$container-style: fluid;

And here is how that looks in the browser:

Creating an entirely fluid grid

Tip

Be aware you can also set a percentage width for a fluid grid container with the following variable:

$container-width: 80%;

Get Sass and Compass for Designers now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.