Why use display: flex;?


#1

Question

Why use display: flex;?

Answer

We can use flexbox, setting a container element to display: flex;, when we want to easily layout, align, and space items within said container in a single (horizontal or vertical) direction.

Some great use cases for flexbox:

  • laying out a collection of items vertically or horizontally, including dimensions and space between items
  • easily aligning items horizontally or vertically