Background

Pessoal estou com um problema que ta me dando muita dor de cabeça !

eu tenho a seguinte configuração na minha pagina:

<div class="header">
 <div class="content">
 (Elementos)
 </div>
</div>

<div class="middle">
 <div class="content">
 (Elementos)
 </div>
</div>

<div class="footer">
 <div class="content">
 (Elementos)
 </div>
</div>

o que acontece é que na ( header, mid e footer) eu tenho uma background-image que deveria se estender infinitamente como aquele menu do google, porem quando agente da um resize nas janelas esse fundo some e os elementos ficam flutuando no nada

alguem sabe como resolver isso ?

Aqui vai um exemplo do que esta acontecendo !

se voce diminuir a tela horizontalmente vai perceber que os elementos no topo ficam flutuando