Skip to content

Instantly share code, notes, and snippets.

@jdsteinbach
Created February 15, 2016 23:02
Show Gist options
  • Save jdsteinbach/2429ab358b7d501963cc to your computer and use it in GitHub Desktop.
Save jdsteinbach/2429ab358b7d501963cc to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
<div class="parent">
<h4 class="title">Title</h4>
<div class="child">Child</div>
<div class="child">Child</div>
<div class="child">Child</div>
<div class="child">Child</div>
<div class="child">Child</div>
<div class="child">Child</div>
</div>
// ----
// Sass (v3.4.21)
// Compass (v1.0.3)
// Bourbon (v4.2.6)
// Neat (v1.6.0)
// ----
@import "bourbon/bourbon";
@import "neat/neat";
.parent {
@include outer-container;
border: 1px solid blue;
padding: 1em 1em 0;
}
.child {
@include span-columns(6);
@include omega("2n + 1");
border: 1px solid red;
margin-bottom: 1em;
padding: 1em;
text-align: center;
}
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.parent {
*zoom: 1;
max-width: 68em;
margin-left: auto;
margin-right: auto;
border: 1px solid blue;
padding: 1em 1em 0;
}
.parent:before, .parent:after {
content: " ";
display: table;
}
.parent:after {
clear: both;
}
.child {
float: left;
display: block;
margin-right: 2.3576516%;
width: 48.8211742%;
border: 1px solid red;
margin-bottom: 1em;
padding: 1em;
text-align: center;
}
.child:last-child {
margin-right: 0;
}
.child:nth-child(2n + 1) {
margin-right: 0;
}
<div class="parent">
<h4 class="title">Title</h4>
<div class="child">Child</div>
<div class="child">Child</div>
<div class="child">Child</div>
<div class="child">Child</div>
<div class="child">Child</div>
<div class="child">Child</div>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment