Rodapé indo pra cima da Div #Conteudo

[kinho! 7]

Ola galera'

 

Pra voces itender e poder me ajudar... Eu criei 2 Div de conteudo usando o Float, Porem ate aí tudo Bom, So que quando a Div de conteudo 'cresce' ela fica atraz da Div de Rodapé, Tem como voces me ajudar ?

 

Resumo:

 

#Div esquerda, Float

 

#Div direita, Float

 

#rodapé, Postion:absolut;

 

Deste já agradeço pela ajuda !

[Rogério Santana 172]

Poste todo o css correspondente a essas três div's (pode até eliminar questão de fonte, cores e bg), fica mais fácil

[kinho! 7]

Ta aí amigo !

 

 

div#bg_banner{ float:left; margin-left:1%; margin-top:70px; }


div#bg_cadastro{ float:right; border:solid 1px #555; padding:1%; margin-right:2%; margin-top:70px; color:#CCC; height:500px; width:22%; word-break:break-all; }


div#rodape{ position:absolute; bottom:0; left:0; background:url(../imagens/creditos.png) #212121 no-repeat center; border-top:solid 1px #555; height:40px; padding:1%; width:98%; margin-top:20px; }

 

[Diéssica 140]

Utilize a propriedade z-index no elemento que está ficando por baixo. Determine um valor superior ao valor do elemento que está por cima.

[inline]z-index: 1;[/inline] no elemento já funciona, geralmente.

:seta: https://developer.mozilla.org/en-US/docs/Web/CSS/z-index

:seta: Understanding z-index

[kinho! 7]

Si eu usar o Z-index, ele irar colocar o rodapé encima do conteudo, aí no caso ia da o mesmo problema, eu preciso é fazer a Div conteudo empurrar o Rodapé para baixo...

[Giluan Moral 0]

Você pode criar a seguinte estrutura

 

 

<div id="pai">

 <div id="topo"></div>

  <div id="conteudo">
   <div id="bg-banner"></div>
    <div id="bg-cadastro"></div>
     <div id="clear"></div>
  </div>

   <div id="rodape"></div>

</div>

Ficaria mas interessante seu codigo dai

você pode posicionar o rodape no final da pagina

 

html, body { height:100% }

#pai { min-height:100%; position:relative;... }
#conteudo { height:100%; padding-bottom: (tamanho do rodape) }
#rodape { height:100px; position;absolute; bottom:0... }

#clear { clear:both; }

dessa forma.