Jeremy Bernier

Shortest Flexbox Tutorial

July 14, 2016

Making a CSS block grid is super easy with Flexbox. Check out this basic example I made.

All you need to do is add the following lines of CSS:

ul {
  display: flex;
  flex-wrap: wrap;
}

li {
  width: 25% //This makes 4 columns per row. Adjust to taste
  //flex-basis: 25% also works as well
}

Jeremy Bernier

Written by Jeremy Bernier who left the NYC rat race to travel the world, work remotely, and make the world a better place.