Setting up a grid system

Our previous example using two-thirds and one-third was more academic than practical. A grid based on halves, quarters, thirds, and so on would be more complex and less intuitive than a strictly column-based grid.

We've all used a 12 column grid which has various sizes (small, medium, large) or a set breakpoint (or breakpoints). These are the most popular methods for two reasons...it works, and it's easy to understand. Furthermore, with the help of Susy we can achieve this with less than 30 lines of Sass! Don't believe me? Let's begin.

Get Mastering Sass 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.