Solucionado
Olá,
No exercício https://cursos.alura.com.br/course/avancando-html-css/task/6122, é pedido para posicionar as palavras-chaves. Tentei posicionar a palavra-chave boas práticas acima da foto e centralizada. Tentei fazer isto de uma forma diferente do position, desta forma:
.boas-praticas{
position: absolute;
top: 0;
margin-left: auto;
margin-right: auto;
}Todavia, isto não deu certo. Poderiam me explicar o porquê?
Oi Roger tudo bem?
Poderia disponibilizar seu projeto no github por gentileza para eu poder analisar. Eu acho que deve ter alguma outra regra css causando interferência. Ou se você quiser você pode clicar com o mouse sobre a palavra boas práticas e depois em inspecionar e analisar o css nas ferramentas de desenvolvedor. Lá te dará uma pista do porque não está funcionando.
Eu tinha entendido errado, não há nenhuma interferência de outras regras. Me desculpe.
Do jeito que você colocou ele ignora a margem. Pois o posição absolute tem prioridade. Ele vai posicionar a imagem em qualquer lugar que você especificar no top, left (ou right, bottom).
Se você quer centralizar a imagem podemos usar a porcentagem.
.boas-praticas {
position: absolute;
top: 50%;
left: 50%;
}Repare que as porcentagem estão relativas ao elemento header que é o elemento pai do pai dele (como ul não tem tamanho definido ele herda do header que é pai da ul).
Ai o B de boas práticas fica centralizado no centro do header tanto no eixo x como no eixo y. Aí você dá um ajustezinho pra ficar do seu gosto.
Espero ter ajudado!!!