Cacher is the code snippet organizer for pro developers

/* # The RWD Calc SCSS mixin  


Use:
~~~~
body {
  
  @include rwdcalc(300, 320, 5, 3, 2);
    @media only screen and (min-width: 37.5em) {
      @include rwdcalc(500, 600, 50, 0, 0); 
    }
    @media only screen and (min-width: 68.5em) {
      @include rwdcalc(1000, 1100, 50, 0, 0); 
    }  
}
~~~~


$target - The desired size of the element
$context - Container width
$margin - margin
$padding - 
$border - 

Styleguide mixins.rwdcalc
*/
* { 
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

@mixin rwdcalc($target, $context, $margin, $padding, $border) {
  width: percentage($target / $context);
  margin-left: percentage($margin / $target);
  margin-right: percentage($margin / $target);
  padding-left: percentage($padding / $target);
  padding-right: percentage($padding / $target);
  border: $border + px;
}