align-content

Olá Eduardo!

O align-items alinha os flex itens de acordo com o eixo do container.

https://codepen.io/origamid/pen/pPePeb

O align-content alinha as linhas do container em relaçao ao eixo vertical.

https://codepen.io/origamid/pen/ybMbZo

Espero que tenha ajudado! :D

Fala Eduardo,

Em resumo o 'align-itemsalinha individualmente os items de um container de acordo com o 'main-axis', já oalign-content` alinha o conjunto dos items de container;

Faz o seguinte exercício teste:

• imagina um Container com 500px de width e height;

• Dentro dele 7 items de 100px de width e height entre 100px e 120px.

• Como colocamos flex-wrap nesse container, iremos ver 5 filhos na primeira linha e 2 na linha de baixo;

• Se no container você setar align-items:center você vai ver que todos os items estão centralizados, ou seja, o centro dos maiores conicide com o centro dos menores;

• mas se você setar align-content:cente, voce vai ver que o conjunto das duas linhas de items está alinhada no centro do pai, mas entre si os items nao estão alinhados;

https://codepen.io/jeffersondesouza/pen/daYyxm

Olá Eduardo!

Caso tenha resolvido a sua duvida peço para que feche o tópico selecionando a solução, por favor!

Bons estudos! ^^