Skip to content

Instantly share code, notes, and snippets.

@drwpow
Last active August 29, 2015 14:20
Show Gist options
  • Save drwpow/dd3a121bf364c3e9912d to your computer and use it in GitHub Desktop.
Save drwpow/dd3a121bf364c3e9912d to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
// ----
// Sass (v3.4.13)
// Compass (v1.0.3)
// ----
$g-columns: 12
.g-b--1of1
@for $column from 1 to $g-columns
@if $column != $g-columns
.g-b--#{$column}of#{$g-columns}
width: percentage($column/$g-columns)
@for $division from 1 to $g-columns
@if $column % $division == 0 and $g-columns % $division == 0
.g-b--#{$column / $division}of#{$g-columns / $division}
@extend .g-b--#{$column}of#{$g-columns}
.g-b--1of12 {
width: 8.33333%;
}
.g-b--2of12, .g-b--1of6 {
width: 16.66667%;
}
.g-b--3of12, .g-b--1of4 {
width: 25%;
}
.g-b--4of12, .g-b--2of6, .g-b--1of3 {
width: 33.33333%;
}
.g-b--5of12 {
width: 41.66667%;
}
.g-b--6of12, .g-b--3of6, .g-b--2of4, .g-b--1of2 {
width: 50%;
}
.g-b--7of12 {
width: 58.33333%;
}
.g-b--8of12, .g-b--4of6, .g-b--2of3 {
width: 66.66667%;
}
.g-b--9of12, .g-b--3of4 {
width: 75%;
}
.g-b--10of12, .g-b--5of6 {
width: 83.33333%;
}
.g-b--11of12 {
width: 91.66667%;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment