Skip to content

Instantly share code, notes, and snippets.

@jdlehman
Created July 22, 2014 19:30
Show Gist options
  • Save jdlehman/ba636f049722573b3afc to your computer and use it in GitHub Desktop.
Save jdlehman/ba636f049722573b3afc to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
<p class="box">Default: Border Box</p>
<div class="component">
<p class="box">Component: Content Box</p>
</div>
// ----
// Sass (v3.3.10)
// Compass (v1.0.0.alpha.20)
// Susy (v2.1.2)
// ----
@import "susy";
html {
box-sizing: border-box;
}
*, *:before, *:after {
box-sizing: inherit;
}
// uncomment this to see why Susy currently
// does not work
// @include global-box-sizing(border-box);
.component {
box-sizing: content-box;
}
.box {
background-color: #aaa;
border: 1px solid #000;
width: 10rem;
height: 3rem;
padding: 0.5rem;
margin: 0.5rem;
}
html {
box-sizing: border-box;
}
*, *:before, *:after {
box-sizing: inherit;
}
.component {
box-sizing: content-box;
}
.box {
background-color: #aaa;
border: 1px solid #000;
width: 10rem;
height: 3rem;
padding: 0.5rem;
margin: 0.5rem;
}
<p class="box">Default: Border Box</p>
<div class="component">
<p class="box">Component: Content Box</p>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment