Instruções

Passo 32

Agora você pode estilizar o layout da sua grade. CSS Grid é similar ao Flexbox, na medida em que possui uma propriedade especial para os elementos pai quanto para os elementos filhos. Neste caso, o elemento pai é o elemento main. Defina o conteúdo para ter um layout de três colunas adicionando a propriedade grid-template-columns com o valor de 1fr 94rem 1fr. Isso criará três colunas onde a coluna do meio tem 94rem de largura e as primeiras e últimas colunas são ambas 1 fração do espaço restante no contêiner da grade.

O que fazer:

Testes:

  • A seção `main` deve ter a propriedade `grid-template-columns` definida como `1fr 94rem 1fr`.

Preview