Grid 3x3

We can create a 3×3 grid by setting flex-grow to 0 and flex-basis to the preferred width for all children (here done using the flex short-hand: flex: 0 32%). The margins between the items are the leftovers from every row, i.e. (100%-32×3)/2=2%. The margin-bottom:2%, to achieve even spacing between all elements.

demo

  • HTML, CSS
  • Includes: index.html and CSS file
Please check for future updates here or at my gitHub page.