16 coisas sobre CSS Grid que aprendi com o freeCodeCamp

tl;dr: gostei bastante de aprender sobre css grid, finalmente se tem uma maneira de fazer layouts super complexos de uma maneira fácil dem CSS.

---

CSS: Como se ativa um grid container em um elemento?

display: grid;

CSS: Qual propriedade define as colunas de um grid container?

grid-template-columns

CSS: Qual propriedade define as linhas de um grid container?

grid-template-rows

CSS: Qual propriedade define um espaço entre as colunas de um grid container?

grid-columns-gap

CSS: Qual propriedade define um espaço entre as linhas de um grid container?

grid-row-gap

CSS: Qual propriedade define o espaço entre linhas e colunas do grid container?

grid-gap

CSS: Qual propriedade define o tamanho de um grid item em colunas?

grid-column

CSS: Qual propriedade define o tamanho de um grid item em linhas?

grid-row

CSS: Qual propriedade define o alinhamento horizontal do grid item?

justify-self

CSS: Qual propriedade define o alinhamento vertical do grid item?

align-self

CSS: Qual propriedade define o alinhamento horizontal dos grid itens de um grid container?

justify-items

CSS: Qual propriedade define o alinhamento vertical dos grid itens de um grid container?

align-items

CSS: Como se cria template areas na grid?

grid-template-areas

CSS: Como se adicionar um grid item em uma template area?

grid-area

CSS: O que “grid-template-columns: repeat(100, 40px);” faz?

Cria 100 colunas de 40px dentro da grid.

CSS: O que a função minmax() faz na grid?

Cria uma coluna com um mínimo e máximo de tamanho.