Olá!
Nesta atividade 06 da aula 03, o instrutor utilizou o grid para resolver o que ele chamou de "gambiarra" ao se utilizar o Flexbox.
A gambiarra no caso seria criar uma div com display: flex
para englobar 2 elementos que deveriam ficar lado a lado na visualização, de modo que o restante dos elementos irmãos continuassem com o alinhamento padrão (um em cada linha).
A solução para evitar essa gambiarra foi fazer o container que contém todos os elementos se tornar um grid com 2 colunas, e colocar a propriedade grid-column: span 2
nos elementos que deveriam ficar sozinhos na linha.
Não consegui entender a vantagem do Grid neste caso. Foi necessário repetir a propriedade grid-column: span 2
em vários elementos para resolver esse problema. Na minha cabeça, foi essa solução que ficou parecendo gambiarra, e não o uso de uma div a mais com Flexbox.
Minhas dúvidas: O correto é como foi feito pelo instrutor, utilizando o Grid para este caso? Ou foi somente um exemplo para introduzir o Grid? As vantagens e o uso do Grid serão explicados com mais detalhes em aulas futuras? Pra mim, que está conhecendo o Grid só agora, ele parece muito com o uso antigo de tabelas para definir o layout da página (e isso me dá arrepios!).
Obrigado.