Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Generated by SassMeister.com.
<div class="page">
<section class="content">content</section>
<aside class="sidebar">sidebar</aside>
</div>
// ----
// libsass (v3.2.5)
// ----
@import "susy";
.page {
@include container(1280px 16 show);
}
.content{
@include span(10 of 16);
}
.sidebar{
@include span(6 of 16);
// or @include span(6 of 16 last);
@include last;
}
.page {
max-width: 1280px;
margin-left: auto;
margin-right: auto;
background-image: linear-gradient(to right, rgba(102, 102, 255, 0.25), rgba(179, 179, 255, 0.25) 80%, transparent 80%);
background-size: 6.32911%;
background-origin: content-box;
background-clip: content-box;
background-position: left top;
}
.page:after {
content: " ";
display: block;
clear: both;
}
.content {
width: 62.02532%;
float: left;
margin-right: 1.26582%;
}
.sidebar {
width: 36.70886%;
float: left;
margin-right: 1.26582%;
float: right;
margin-right: 0;
}
<div class="page">
<section class="content">content</section>
<aside class="sidebar">sidebar</aside>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.