CSS center an element

How to center using flexbox

You have the items in a div and then you set the display to flexbox. To align items in the center of their container div, you use the justify-content and the align-items property, like so:

  display: flex;  
  justify-content: center;  
  align-items: center;  

This will align the items in the middle vertically and horizontally of their div or span container.