Código CSS:
.agenda__item {
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-template-areas:
"imagem imagem"
"data botão"
}
.agenda__item img {
grid-column: 1/ 3;
grid-area: imagem;
}
.agenda__item agenda__informacoes {
grid-area: data;
}
.agenda__item agenda__atracao {
grid-area: botão;
}
Oii, Guilherme!
Obrigada por compartilhar seu código com a comunidade Alura.
O jeito como você organizou as áreas com grid-template-areas ficou bem estruturado. Isso ajuda muito na leitura e manutenção do layout.
Conte com o apoio da comunidade Alura na sua jornada. Abraços e bons estudos!