Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Dúvida sobre background-color

Porque o background-color só aparece se eu colocar algum conteúdo dentro no header? Se eu colocar background-color no body ele funciona normalmente sem nenhum conteúdo, mas se eu tentar colocar uma cor no header sem ter nenhum conteúdo dentro nada aparece.

Na minha visão se eu colocasse o background-color no header após o body no CSS a cor do header deveria sobrescrever a do body, por que isso não acontece?

    <body>
        <header>
            <p>Exemplo</p>
        </header>
    </body>
body{
    background-color: gainsboro;
}

header{
    background-color: #6A5ACD;
}
2 respostas
solução!

José, boa tarde!

Isso acontece porque o body, tem uma largura e altura do tamanho da tela, ou seja, ele vai preencher tudo que tiver naquela área com a cor que você definiu, já o header, apesar dele ter uma largura definida como 100% ele não tem altura, ou seja, a cor está sendo aplicada, mas não dá pra ver porque não tem nem 1px de altura, por isso quando você colocar um conteúdo na tag dá pra ver, porque cria uma altura pro header.

E ele não coloca a cor do header no body, pq no final das contas os elementos escolhidos são diferentes.

Caso tenha te ajudado não se esqueça de marcar como solucionado.

Espero ter ajudado e bons estudos!

Obrigado amigo, você é um amigo! Excelente explicação. O HTML parece simples de aprender, mas sempre tem alguns detalhes assim que deixa passar...