Skip to content

Instantly share code, notes, and snippets.

@highercomve
Last active October 9, 2020 10:05
Show Gist options
  • Select an option

  • Save highercomve/32a57c3b3af14f02b16c to your computer and use it in GitHub Desktop.

Select an option

Save highercomve/32a57c3b3af14f02b16c to your computer and use it in GitHub Desktop.
Guia de Flexbox
.container {
align-content: flex-start | flex-end | center | space-between | space-around | stretch;
}
.container {
align-items: flex-start | flex-end | center | baseline | stretch;
}
#item3 {
align-self: auto | flex-start | flex-end | center | baseline | stretch;
}
.container {
display: flex; /* tambien se puede usar el inline-flex */
}
.item {
flex-basis: <ancho> | auto; /* default auto */
}
.container {
flex-direction: row | row-reverse | column | column-reverse;
}
.item {
flex-grow: <numero>; /* por defecto 0 */
}
.item {
flex-shrink: <numero>; /* por defecto 1 */
}
.container{
flex-wrap: nowrap | wrap | wrap-reverse;
}
.item {
flex: none | <'flex-grow'> <'flex-shrink'> <flex-basis'>
}
.container {
justify-content: flex-start | flex-end | center | space-between | space-around;
}
#item2 {
order: <integer>;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment