Skip to content

Flexbox Rule of Thumb

Daisho Komiyama edited this page Jun 14, 2018 · 1 revision

There seems certain rules for me when I write CSS using Flexbox...

Properties always to be added

/* for container (parent) */
.row {
  display: flex;
  flex-flow: row wrap;
}

/* for items (children) */
.item {
  flex: 0 0 25%;
}
/*
shorthand for
flex-grow: 0; (default: 0)
flex-shrink: 0; (default: 1)
flex-basis: 25%;
*/
Clone this wiki locally