Solucionado
Eu tenho uma dúvida, como que o nosso código adivinhou que nós queríamos fazer exatamente 4 colunas e 3 linhas naquela área? nós em momento nenhum declaramos isso no novo código, apenas fizemos:
grid-template-columns: 25% 25% 25% 25%;
grid-template-rows: 33.3% 33.3% 33.3%
Fala ai Mauricio, tudo bem? Vamos lá:
Eu tenho uma dúvida, como que o nosso código adivinhou que nós queríamos fazer exatamente 4 colunas e 3 linhas naquela área? nós em momento nenhum declaramos isso no novo código, apenas fizemos:
Isso porque na definição das colunas a gente informou quatro valores, nesse caso, o grid aplica cada valor para uma coluna.
O mesmo vale para as linhas, a tente aplicou três valores, no caso, ele vai aplicar os valores para cada linha.
Ou seja, para cada valor ele entende que seria uma coluna ou linha.
Se a gente informar dez valores, ele aplicaria cada valor para uma coluna ou linha.
Espero ter ajudado.
Valeu mano, fechando como solução!
Magina Mauricio, sempre que precisar não deixe de criar suas duvidas.
Abraços e bons estudos.