Entrar Ainda não tem acesso?
2
respostas

Aula 2 exercício 6 - Posicionamento de palvaras no header

Referente ao curso HTML5 e CSS3 II: Turbinando as suas páginas

por Bruna Mello Donadel
| 167.7k xp | 17 posts

Eu fiquei com uma dúvida relacionada à dúvida do colega https://cursos.alura.com.br/forum/topico-palavras-pela-pagina-e-position-relative-no-header-26667

Parece que a resposta no exercício está errada, e leva à confusao, pois nao cita a inclusao da position no header. Quando fiz também ficou desconfigurado.

Algúem consegue me ajudar a entender melhor, como funciona a questao da medida em % que foi utilizada no exercício? Ela é relativa a media de algum elemento, ou dele próprio?

Quando utilizei "relative" no lugar de "absolute" no exercício (para testar o comportamento) algumas palavras foram parar fora da área do layout da página.

2 respostas
por Bruna Mello Donadel
| 167.7k xp | 17 posts

obs: Mesmo utilizando o código da resposta do exercício, e aplicando o position relative no header, as palavras nao ficaram posicionadas como no exemplo da aula.

por Mario Souto
| 377.3k xp | 735 posts
Alura Scuba Team Instrutor e Desenvolvedor

Bruna, o % varia de acordo com onde você está aplicando, mas normalmente ele pega como base o tamanho do elemento pai. No caso quando um elemento tem position absolute ou relative e você coloca 20% e o pai deste elemento tem 1000px, seu elemento ficará em uma posição equivalente a 200px.

Segue um exemplo para você dar uma olhada: https://codepen.io/soutomario/pen/braZeW