Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

kinho!

Rodapé indo pra cima da Div #Conteudo

Recommended Posts

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 !

Compartilhar este post


Link para o post
Compartilhar em outros sites

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; }

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

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

Compartilhar este post


Link para o post
Compartilhar em outros sites

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...

Compartilhar este post


Link para o post
Compartilhar em outros sites

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.

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.