Skip to content

Instantly share code, notes, and snippets.

@dextermb
Last active December 14, 2016 12:38
Show Gist options
  • Select an option

  • Save dextermb/af6f9b479d5d296418c1feeeba0df657 to your computer and use it in GitHub Desktop.

Select an option

Save dextermb/af6f9b479d5d296418c1feeeba0df657 to your computer and use it in GitHub Desktop.
/**
* Flexbox
*/
.flexbox {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
align-items: center;
align-content: center;
}
.flexbox.fb-col {
flex-direction: column;
}
.flexbox.fb-hs {
justify-content: flex-start;
}
.flexbox.fb-he {
justify-content: flex-end;
}
.flexbox.fb-vs {
align-items: flex-start;
}
.flexbox.fb-ve {
align-items: flex-end;
}
.flexbox.fb-grd>* {
flex: 1 0 0;
}
.flexbox>* {
margin-bottom: 10px;
margin-left: 10px;
margin-right: 10px;
}
.flexbox.fb-col>* {
margin-left: 0;
margin-right: 0;
}
.flexbox>:first-child {
margin-left: 0;
}
.flexbox>:last-child {
margin-right: 0;
}
.flexbox>.float-left {
margin-right: auto;
}
.flexbox>.float-right {
margin-left: auto;
}
.flexbox>.fb-grow {
flex-grow: 1;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment