Skip to content

Instantly share code, notes, and snippets.

@boogermann
Created September 14, 2016 06:07
Show Gist options
  • Save boogermann/2e42f4df08d9e76c91e876f3ae403ce5 to your computer and use it in GitHub Desktop.
Save boogermann/2e42f4df08d9e76c91e876f3ae403ce5 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
// ----
// Sass (v3.4.21)
// Compass (v1.0.3)
// ----
@mixin responsive-calc($columns: 2, $under: 480px) {
$pre-computed-calc: #{($under * ($under / 1px))} - #{(100% * ($under / 1px))};
display: inline-block;
min-width: ($under / $columns);
width: (100% / $columns);
max-width: 100%;
min-width: -webkit-calc(100% / #{$columns});
min-width: calc(100% / #{$columns});
width: -webkit-calc(#{$pre-computed-calc});
width: calc(#{$pre-computed-calc});
}
.foo {
@include responsive-calc($columns: 3, $under: 600px);
}
.foo {
display: inline-block;
min-width: 200px;
width: 33.33333333%;
max-width: 100%;
min-width: -webkit-calc(100% / 3);
min-width: calc(100% / 3);
width: -webkit-calc(360000px - 60000%);
width: calc(360000px - 60000%);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment