Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

[Dúvida] grid-area, grid-row e grid-column não funcionam desse jeito?

Referente ao curso CSS: construindo layouts com Grid, no capítulo Desenhando no template e atividade Grid Lines

por Victor Souza
| 62.9k xp | 13 posts
Suporte Técnico - TI

Tentei aplicar a tentativa 1 e a tentativa 2. Obtive resultados completamente diferentes. Alguém poderia me explicar?

.secao-horizontal .cartao__imagem { grid-column-start: 1; grid-column-end: 2; grid-row-start: 1; grid-row-end: 4; }

.secao-horizontal .cartao__imagem { /tentativa 1/ grid-column: 1 / 2; grid-row: 1 / 4; }

.secao-horizontal .cartao__imagem { /tentativa 2/ grid-area: 1 / 1 / 2 / 4; }

1 resposta
solução!
por Victor Souza
| 62.9k xp | 13 posts
Suporte Técnico - TI

Entendi agora o que houve! Confundi e troquei a ordem dos valores.

MODO CORRETO: grid-area: row-start/column-start/row-end/column-end

Sendo: grid-area: 1 / 1 / 4 / 2;

OU

grid-column: 1 / 2;

grid-row: 1 / 4;