Várias cores de fundo para css aninhados divs

Question

Tudo bem. Esta é a situação. Eu criei um site com uma bandeira preta na parte superior com um logotipo, sua altura é de 100px e sua cor de fundo é # 000. Em seguida eu quero uma grande div "main_content" para abranger a navegação junto com qualquer conteúdo dentro da página, por isso não incluiria o rodapé. Neste caso existem vários divs aninhados dentro da área de main_content da página e já existe uma cor de fundo definida para eles. O problema é que uma vez que eu aplicar uma cor de fundo para o div chamada "main_content" ele só se aplica-lo para a barra de navegação e, em seguida, pára porque ele é executado no div aninhada que já uma cor definida. Eu estou querendo saber se há uma regra CSS que estou em falta aqui ...

A única correção que tenho encontrado é que eu deve definir uma altura para o div main_content, há uma maneira de contornar isso? Eu não quero ter que definir uma altura para a área de conteúdo, porque eu quero que ele apenas coincidir com a altura do conteúdo que preenche.

Answer 1

O que é mais acontecimento provável é que seus outros divs aninhados estão herdando a cor de sua main_content div pai, para corrigir isso, você deve fornecer a cor explicitamente para seus divs aninhadas. Outra coisa que você mencionou é que você deseja aplicar a altura para main_content como por seu conteúdo pode fazê-lo, dando-lhe uma altura de 100%, por exemplo:

<style>
#main_content{height:100%;}
</style>

Answer 2

Eu acho que eu encontrei, overflow: hidden, eu não tenho certeza se esta é a solução certa, mas é o melhor que eu tenho