Grade onde o usuário faz escolhas individuais em cada célula. Existe uma maneira melhor?

1. Qual é a diferença entre grade e flexão?
2. Que valor devo usar se quiser todas as minhas colunas no meu layout da grade para ter a mesma largura?
3. São áreas de modelo de grade boas?
4. Qual propriedade deve ser usada se você quiser alinhar um item de grade dentro de uma célula ao longo do eixo da linha?

Qual é a diferença entre grade e flexão?

Grade e flexbox. A diferença básica entre o layout da grade CSS e o layout do CSS Flexbox é que o Flexbox foi projetado para layout em uma dimensão - uma linha ou uma coluna. A grade foi projetada para layout bidimensional - linhas e colunas ao mesmo tempo.

Que valor devo usar se quiser todas as minhas colunas no meu layout da grade para ter a mesma largura?

Se você realmente precisa que as colunas sejam exatamente a mesma largura que você deve usar: colunas da grade-template: Repita (3, minmax (0, 1fr)); Minmax (0, 1FR) permite que as faixas da grade sejam tão pequenas quanto 0, mas tão grande quanto 1FR, criando colunas que permanecerão iguais.

São áreas de modelo de grade boas?

Uma área de modelo de grade CSS faz uma representação visual da grade usando colunas e linhas. Isso contribui para um processo de design mais rápido do que quando os valores de colocação baseada em linha ou coluna de grade e linha de grade são usados.

Qual propriedade deve ser usada se você quiser alinhar um item de grade dentro de uma célula ao longo do eixo da linha?

A justificativa é usada para alinhar um item de grade ao longo do eixo da linha.