Skip to content

Instantly share code, notes, and snippets.

@shayhowe
Created July 18, 2014 20:41
Show Gist options
  • Save shayhowe/ec306ab33eb03e7d99b7 to your computer and use it in GitHub Desktop.
Save shayhowe/ec306ab33eb03e7d99b7 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
// ----
// Sass (v3.3.10)
// Compass (v1.0.0.alpha.20)
// ----
$columns: 12
@while 1 <= $columns
@for $column from 1 to $columns
@if ($column % 2 == 0) and ($columns % 2 == 0)
.grid-#{$column}-#{$columns}
@extend .grid-#{$column/2}-#{$columns/2}
@else if ($column % 3 == 0) and ($columns % 3 == 0)
.grid-#{$column}-#{$columns}
@extend .grid-#{$column/3}-#{$columns/3}
@else if ($column % 5 == 0) and ($columns % 5 == 0)
.grid-#{$column}-#{$columns}
@extend .grid-#{$column/5}-#{$columns/5}
@else
.grid-#{$column}-#{$columns}
width: ($column/$columns) * 100%
$columns: $columns - 1
.grid-1-12 {
width: 8.33333%;
}
.grid-5-12 {
width: 41.66667%;
}
.grid-7-12 {
width: 58.33333%;
}
.grid-11-12 {
width: 91.66667%;
}
.grid-1-11 {
width: 9.09091%;
}
.grid-2-11 {
width: 18.18182%;
}
.grid-3-11 {
width: 27.27273%;
}
.grid-4-11 {
width: 36.36364%;
}
.grid-5-11 {
width: 45.45455%;
}
.grid-6-11 {
width: 54.54545%;
}
.grid-7-11 {
width: 63.63636%;
}
.grid-8-11 {
width: 72.72727%;
}
.grid-9-11 {
width: 81.81818%;
}
.grid-10-11 {
width: 90.90909%;
}
.grid-1-10 {
width: 10%;
}
.grid-3-10 {
width: 30%;
}
.grid-7-10 {
width: 70%;
}
.grid-9-10 {
width: 90%;
}
.grid-1-9 {
width: 11.11111%;
}
.grid-2-9 {
width: 22.22222%;
}
.grid-4-9 {
width: 44.44444%;
}
.grid-5-9 {
width: 55.55556%;
}
.grid-7-9 {
width: 77.77778%;
}
.grid-8-9 {
width: 88.88889%;
}
.grid-1-8 {
width: 12.5%;
}
.grid-3-8 {
width: 37.5%;
}
.grid-5-8 {
width: 62.5%;
}
.grid-7-8 {
width: 87.5%;
}
.grid-1-7 {
width: 14.28571%;
}
.grid-2-7 {
width: 28.57143%;
}
.grid-3-7 {
width: 42.85714%;
}
.grid-4-7 {
width: 57.14286%;
}
.grid-5-7 {
width: 71.42857%;
}
.grid-6-7 {
width: 85.71429%;
}
.grid-1-6, .grid-2-12 {
width: 16.66667%;
}
.grid-5-6, .grid-10-12 {
width: 83.33333%;
}
.grid-1-5, .grid-2-10 {
width: 20%;
}
.grid-2-5, .grid-4-10 {
width: 40%;
}
.grid-3-5, .grid-6-10 {
width: 60%;
}
.grid-4-5, .grid-8-10 {
width: 80%;
}
.grid-1-4, .grid-3-12, .grid-2-8 {
width: 25%;
}
.grid-3-4, .grid-9-12, .grid-6-8 {
width: 75%;
}
.grid-1-3, .grid-3-9, .grid-2-6, .grid-4-12 {
width: 33.33333%;
}
.grid-2-3, .grid-6-9, .grid-4-6, .grid-8-12 {
width: 66.66667%;
}
.grid-1-2, .grid-5-10, .grid-3-6, .grid-6-12, .grid-2-4, .grid-4-8 {
width: 50%;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment