Solucionado
Boa noite. Pelo que eu entendi do css, o que vem por último sobrescreve o que veio antes, correto? No exercício "Posicionamento dos elementos 1", temos o seguinte código:
h2 {
position: absolute;
top: 0;
}
ul {
position: relative;
}Na, resposta, está que a h2 ficará sobreposto a ul. Mas quando a h2 é lida, a ul ainda não está com a position relative, pois está vindo dps do h2. Como pode então o h2 sobrepor o ul? Achei que ficaria no topo da janela. Obrigado!
hoje, com a Alura e o Google Gemini
Bom dia Andris tudo bem? Em CSS existe sim um efeito que chamamos de "cascata", ou seja, a regra que vem depois, sobrepõem a regra anterior.
Exemplo:
h1 {
color: red;
}
h1 {
color: blue;
}Nesse caso eu estou atribuindo cores ao mesmo seletor, que no caso é a tag h1. Mas somente a cor azul será exibida pois foi a última lida pelo CSS, que lê o arquivo de cima pra baixo.
No exemplo que você postou, o que acontece é o seguinte:
Você está definindo a tag de título "h2" com position: absolute, ou seja, ela perde sua referência de posição atual, ela fica perdida na tela.
E logo depois você coloca a tag ul(lista não ordenada) com position: relative.
Logo, levando em consideração seu arquivo HTML, a tag h2 vai ter agora uma referência para se posicionar na tela, você colocou a "ul" como referência para a tag h2. E no caso a ordem de regras no css não importa, pois você está utilizando dois seletores diferentes "h2", e "ul". O CSS lê isso tão rapidamente que não interessa colocar um position absolute primeiro, antes de um position relative.
Entendi! Faz sentido mesmo! Muito obrigado, Fábio!
Por nada Andris, pode contar com a gente. Se puder marcar a resposta como solução Agradeço.