naeemakram

Flexible Layouts with Susy & Breakpoint

Creating layouts for responsive design can be challenging because of the math involved in calculating column widths and gutters, so it’s common for designers to turn to Frameworks and/or Sass to help simplify some of the process. A lot of frameworks are structured around a 12-column grid, but a flexible and responsive grid doesn’t always fit into this structure. In this article, I’m going to show you how to use a coupe of Sass extensions that can help you create truly flexible layout that transcend the 12-column grid. 

In this article, I’m going to show you how to use a couple of Sass extensions to tame your layout problems.

The problem

Responsive design for layouts can be tough, because it involves calculating: