Skip to content

Instantly share code, notes, and snippets.

@patrickbjohnson

patrickbjohnson/SassMeister-input-HTML.html

Created August 31, 2015 01:52
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save patrickbjohnson/51f994bb9251b804db35 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save patrickbjohnson/51f994bb9251b804db35 to your computer and use it in GitHub Desktop.
Download ZIP
Generated by SassMeister.com.
Raw
SassMeister-input-HTML.html
<div class="portfolio-item">thing</div>
<div class="portfolio-item">thing</div>
<div class="portfolio-item">thing</div>
Raw
SassMeister-input.scss
// ----
// libsass (v3.2.5)
// ----
@import "susy";
$susy: (
gutters: 30px/360px,
);
.body {
overflow: hidden;
}
.portfolio-item{
@include gallery(4 of 12);
background: skyblue;
max-width:360px;
}
Raw
SassMeister-output.css
.body {
overflow: hidden;
}
.portfolio-item {
width: 32.90323%;
float: left;
background: skyblue;
max-width: 360px;
}
.portfolio-item:nth-child(3n + 1) {
margin-left: 0;
margin-right: -100%;
clear: both;
margin-left: 0;
}
.portfolio-item:nth-child(3n + 2) {
margin-left: 33.54839%;
margin-right: -100%;
clear: none;
}
.portfolio-item:nth-child(3n + 3) {
margin-left: 67.09677%;
margin-right: -100%;
clear: none;
}
Raw
SassMeister-rendered.html
<div class="portfolio-item">thing</div>
<div class="portfolio-item">thing</div>
<div class="portfolio-item">thing</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment