Skip to content

Instantly share code, notes, and snippets.

@mirisuzanne
Created January 5, 2015 18:49
Show Gist options
  • Save mirisuzanne/e8e119d24ae8c4877ec1 to your computer and use it in GitHub Desktop.
Save mirisuzanne/e8e119d24ae8c4877ec1 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
<article class="block">1</article>
<article class="block">2</article>
<article class="block">3</article>
<article class="block">4</article>
<article class="block">5</article>
<article class="block">6</article>
<article class="block">7</article>
// ----
// Sass (v3.4.9)
// Compass (v1.0.1)
// Susy (v2.1.3)
// ----
@import 'susy';
$susy: (
global-box-sizing: border-box,
use-custom: (
rem: true
),
columns: 12,
column-width: 4em,
gutters: 1/4
);
.block {
@include span(4 of 12);
&:nth-child(3n) {
@include last;
}
}
// so you can see it...
.block {
background: lightblue;
margin-bottom: 1em;
}
.block {
width: 32.20339%;
float: left;
margin-right: 1.69492%;
}
.block:nth-child(3n) {
float: right;
margin-right: 0;
}
.block {
background: lightblue;
margin-bottom: 1em;
}
<article class="block">1</article>
<article class="block">2</article>
<article class="block">3</article>
<article class="block">4</article>
<article class="block">5</article>
<article class="block">6</article>
<article class="block">7</article>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment