Skip to content

Instantly share code, notes, and snippets.

@fieldoffice
Created October 29, 2014 15:19
Show Gist options
  • Save fieldoffice/c7b8538890a6e1cab147 to your computer and use it in GitHub Desktop.
Save fieldoffice/c7b8538890a6e1cab147 to your computer and use it in GitHub Desktop.
Sass Flexbox Mixins
@mixin flexbox() {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
}
@mixin flex($values) {
-webkit-box-flex: $values;
-moz-box-flex: $values;
-webkit-flex: $values;
-ms-flex: $values;
flex: $values;
}
@mixin order($val) {
-webkit-box-ordinal-group: $val;
-moz-box-ordinal-group: $val;
-ms-flex-order: $val;
-webkit-order: $val;
order: $val;
}
.item-container {
@include flexbox();
{
.item {
@include flex(1 300px);
@include order(2);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment