Seção extra baseada na documentação da W3C: https://www.w3schools.com/css/css3_flexbox.asp

Inicialmente tínhamos quatro tipos de layout:

O layout flex foi criado para facilitar o desenvolvimento de páginas responsivas.

No momento de publicação deste curso 97.7% dos usuários globais utilizam navegadores que suportam flexbox de acordo com o site Can I Use It.

O primeiro passo para a utilização da flexbox é a definição de um container, um elemento HTML que irá conter o nosso layout flex.

<div class="flex-container">
  <div>1</div>
  <div>2</div>
  <div>3</div>
</div>

Após isto, definimos por CSS que o tipo de display do nosso container será flex.

.flex-container {
  display: flex;
}

Com isto, nós desbloqueamos as seguintes propriedades:

Flex-direction