Tive que acrescentar ao populares__conteudo
um space-between
. Me incomodou o fato de não estarem alinhadas na vertical, como no protótipo, as imagens das seções populares e destaques. Deixei assim:
.populares__conteudo {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
grid-area: conteudo;
padding: 1rem 0;
}
Outro comentário: Lá na aula 03 // 03, onde ajustamos a seção populares, eu segui as orientações todas, e onde o resultado do professor estava 'dando errado' ou escondendo as imagens, o meu já estava ok. Confesso que fiquei confuso, mas como o meu estava dando certo, toquei adiante.
Acho interessante estas pausas no caminho, para explicar algumas razões e editar depois.
Mas achei que a sequência de edições no CSS não seguiu uma lógica tão sequencial (ou uma cascata ?) que ajudasse a entender onde exatamente eu estava mexendo. Acredito que em CSS é importante a gente ir 'de fora para dentro' sempre que possível, ainda mais mesclando flex e grid.
Tenho por hábito registrar roteiro em Markdown. E quando anotei tudo o que havia feito, "repeti para mim mesmo" os passos em outra sequência, que a meu ver acompanhava mais a 'cascata' do CSS. Quero dizer que: o vai e vem na edição das classes, nesta aula em particular, tornou confusa a compreensão. Mas como eu sou de deixar migalhas de pão no caminho, me encontrei e 'costurei' as ideias. Mas fica o registro aí.
EDIT: Acrescentei mais um margin-right: .5rem
na classe destaques
, na aba de mesmo nome. E ficou tudo alinhado.