Skip to content

Instantly share code, notes, and snippets.

@naeemakram
naeemakram / markdown.txt
Created Jul 5, 2022 — forked from planetoftheweb/markdown.txt
Unformatted Markdown Text
View markdown.txt
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: