Skip to content

Instantly share code, notes, and snippets.

@jonchretien
Created October 7, 2013 17:25
Show Gist options
  • Save jonchretien/6871626 to your computer and use it in GitHub Desktop.
Save jonchretien/6871626 to your computer and use it in GitHub Desktop.
CSS Tricks Sass mixin for Flexbox: http://css-tricks.com/snippets/css/a-guide-to-flexbox/
@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;
}
.wrapper {
@include flexbox();
}
.item {
@include flex(1 200px);
@include order(2);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment