[DÚVIDA] Qual a diferença de *align-items: center;*para *justify-content: center;* ? Quando usar um e quando usar outro?

Olá, Vicente.

Tudo bem?

A principal diferença entre elas é que a primeira alinha os itens verticalmente e a segunda alinha os itens horizontalmente.

O align-items: center; é usado para centralizar os itens verticalmente dentro de um container, enquanto o justify-content: center; é usado para centralizar os itens horizontalmente.

Por exemplo, se você tiver uma div com vários elementos dentro e quiser que eles fiquem centralizados verticalmente, use o align-items: center;. Já se quiser centralizá-los horizontalmente, use o justify-content: center;.

Lembrando que se você mudar o flex-direction para column ou seja em coluna, eles invertem, o align-items: center; passa a ser usado para centralizar os itens horizontalmente dentro de um container, e o justify-content: center; passa a ser usado para centralizar os itens verticalmente.

Essas propriedades podem ser usadas em conjunto para centralizar os itens tanto vertical quanto horizontalmente.

Espero ter ajudado e bons estudos!