Acredito que tenha um pequeno erro de digitação no texto de apoio da questão. Veja abaixo
No exercício uma das instruções diz o seguinte:
"Segunda coluna ocupando duas linhas e duas colunas - o elemento azul claro com a classe meio;"
Se seguir o texto, o código seria:
.meio {
grid-column: 2 / span 2;
grid-row: 1 / span 2;
background-color: #2aa6cc;
border-radius: 10px;
min-width: 50px;
min-height: 50px;
}
note o span 2
no grid-row
E o layout não saíria conforme a imagem de apoio
No gabarito a resposta é:
.meio {
grid-column: 2 / span 2;
grid-row: 1 / span 3;
background-color: #2aa6cc;
border-radius: 10px;
min-width: 50px;
min-height: 50px;
}
nesse está com o span 3
assim ficando conforme a questão pede.
Então acredito que o texto deveria ser "Segunda coluna ocupando TRÊS linhas e duas colunas - o elemento azul claro com a classe meio;"
não?