Skip to content

Instantly share code, notes, and snippets.

@angelicahl88

angelicahl88/Sass grid

Created November 19, 2016 18:20
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save angelicahl88/877067372de2e94cb6ada63db5ee3015 to your computer and use it in GitHub Desktop.
Save angelicahl88/877067372de2e94cb6ada63db5ee3015 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
Sass grid
@function grid-width($count, $gutter, $width) {
@return ($count - 1) * $gutter + ($count * $width);
}
@function context-width($context, $gutter, $width) {
@return $context * ($width + $gutter);
}
@mixin the-grid($count, $context: 12, $width: 60, $gutter: 20) {
width: percentage(grid-width($count, $gutter, $width) / context-width($context, $gutter, $width));
}
.block {
@include the-grid(6);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment