O instrutor definiu o CSS da imagem do Pubg da seguinte forma:
.destaques__secundario:nth-child(2) {
background: url('../img/pubg.jpg') center / cover no-repeat;
grid-column: 4 / 4;
grid-row: 1 / 1;
}Creio, supondo que eu não esteja errado, que a forma correta seria:
.destaques__secundario:nth-child(2) {
background: url('../img/pubg.jpg') center / cover no-repeat;
/* Alterei as próximas duas propriedades/*
grid-column: 4 / 5;
grid-row: 1 / 2;
}O resultado acaba sendo o mesmo, mas acho que isso ocorre porque a imagem é obrigada a ocupar pelo menos 1 "bloco" de tamanho. Do jeito que nos foi informado, ela ocuparia 0 colunas (começa na 4 coluna e termina na 4) e 0 linhas (começa na 1 linha e termina na 1). As outras imagens estão com o mesmo problema, exceto a do Fortnite, que aparenta contar as colunas e linhas de forma correta (coincidentalmente, creio ser a única na qual esse método de contagem traria uma diferença).
Essa forma de contagem que eu utilizei aparenta estar de acordo com a documentação feita pela Mozilla: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/Line-based_Placement_with_CSS_Grid (vide o bloco "two" do segundo exemplo). Dito isso, gostaria de saber de fato qual das duas formas de contagem é a correta.
