div rodape em cima do conteudo

[mulequim]

Ola pessoal estou fazendo um modelo para um site simples meu mesmo.

Mas o rodape ta me quebrando a cabeça.... já tentei de tudo mas ele sempre fica em cima das outras divs. vejam e se puderem me mostrem uma solução.

De ante mão obrigado!!

Olha as divs:

<div id="topo">
<div id="img_topo">
<img src="imagens/dom.gif" width="100px" height="110px"/>
</div>
<div id="txt_topo">
<h1>Base Aérea de Brasília</h1><br />
<h2>Sexto Esquadrão de Transporte Aéreo</h2><br />
<h3>Seção de Informática</h3>
</div>
</div>

<div id="geral_conteudo">
<div id="menu">
</div>
<div id="conteudo">
<div>
<div id="clear"></div>
</div>

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

Vejam agora o css:

* {margin: 0px; padding:0px;}
div#topo{
margin:0px auto;
width:800px;
height:150px;
border:#009 1px solid;
text-align:center;
background-color:#93FF93;
}
div#img_topo{
width:110px;
height:120px;
border:#009 0px solid;
margin: 5px 0px 0px 5px;
text-align:center;
float:left;
}
div#txt_topo{
width:650px;
height:120px;
border:#009 0px solid;
margin: 10px 0px 0px 5px;
text-align:center;
float:left;
}
div#txt_topo h1 {
font-family:Verdana, Geneva, sans-serif;
font-size:20px;
text-transform:uppercase;
font-weight:bold;
font:Verdana, Geneva, sans-serif;
}
div#txt_topo h2 {
font-family:Verdana, Geneva, sans-serif;
font-size:16px;
text-transform:uppercase;
font:Verdana, Geneva, sans-serif;
}
div#txt_topo h3 {
font-family:Verdana, Geneva, sans-serif;
font-size:14px;
text-transform:uppercase;
text-decoration:underline;
font:Verdana, Geneva, sans-serif;
}

div#geral_conteudo{
margin:0px auto;
width:800px;
height:450px;
border:#F00 1px solid;
text-align:center;
margin-top: 5px;
}
div#menu{
width:790px;
height:40px;
border:#F00 1px solid;
margin:5px 5px 5px 5px;
text-align:center;
background-color:#006;
margin-top: 5px;

/* sup dir inf esq*/
}
div#conteudo{
width:790px;
height:390px;
border:#90F 1px solid;
margin: 5px 0px 0px 5px;
text-align:center;
background-color:#93FF93;


}
div#clear { clear:both; }

div#rodape{
position:absolute;
margin: 0px auto;
width:800px;
height:85px;
border:#FF0 1px solid;
text-align:center;
margin-bottom: 5px;
margin-top:5px;
margin-bottom:5px;
}

VAleu pessoal conto com a ajuda de vocês!!

[CarlaB]

OIá,

sou nova por aqui e encontrei esse mesmo erro ao fazer o meu rodapé. Encontrei esse tuto nas minhas andanças, acho que funciona, ainda não testei porque estou apanhando no body, talvez te ajude http://www.cssstickyfooter.com/br/using-sticky-footer-code.html

Boa sorte, espero ter contribuído de alguma forma!

[tiago31]

Ola tudo bem amigo.

Você tem dois pequenos problemas no seu codigo.

1- Primeiro você esqueceu de fechar a div do "conteudo".

2- Você esta usando "position: absolute;" na "div#rodape"

vou colocar o codigo aqui e ai você ve se o codigo esta como você quer.

* {margin: 0px; padding:0px;}
div#topo{
        margin:0px auto;
        width:800px;
        height:150px;
        border:#009 1px solid;
        text-align:center;
        background-color:#93FF93;
}
div#img_topo{
        width:110px;
        height:120px;
        border:#009 0px solid;
        margin: 5px 0px 0px 5px;
        text-align:center;
        float:left;
}
div#txt_topo{
        width:650px;
        height:120px;
        border:#009 0px solid;
        margin: 10px 0px 0px 5px;
        text-align:center;
        float:left;
}
div#txt_topo h1 {
    font-family:Verdana, Geneva, sans-serif;
    font-size:20px;
    text-transform:uppercase;
    font-weight:bold;
    font:Verdana, Geneva, sans-serif;
}    
div#txt_topo h2 {
    font-family:Verdana, Geneva, sans-serif;
    font-size:16px;
    text-transform:uppercase;
    font:Verdana, Geneva, sans-serif;
}
div#txt_topo h3 {
    font-family:Verdana, Geneva, sans-serif;
    font-size:14px;
    text-transform:uppercase;
    text-decoration:underline;
    font:Verdana, Geneva, sans-serif;
}
div#geral_conteudo{
    margin:0px auto;
    width:800px;
    height:450px;
    border:#F00 1px solid;
    text-align:center;
    margin-top: 5px;
}
div#menu{
    width:790px;
    height:40px;
    border:#F00 1px solid;
    margin:5px 5px 5px 5px;
    text-align:center;
    background-color:#006;
    margin-top: 5px;
        
        /* sup dir inf esq*/    
}    
div#conteudo{
    width:790px;
    height:390px;
    border:#90F  1px solid;
    margin: 5px 0px 0px 5px;
    text-align:center;
    background-color:#93FF93;
    

}
div#clear { clear:both; }
div#rodape{
    position: absolute;
    margin: 0px auto;
    width:800px;
    height:85px;
    border:#FF0 1px solid;
    text-align:center;
    margin-bottom: 5px;
    margin-top:5px;
    margin-bottom:5px;
}

<div id="topo">
    <div id="img_topo">
        <img src="imagens/dom.gif" width="100px" height="110px"/>   
    </div>
    <div id="txt_topo">
          <h1>Base Aérea de Brasília</h1><br />
        <h2>Sexto Esquadrão de Transporte Aéreo</h2><br />
        <h3>Seção de Informática</h3>
    </div>    
</div>
<div id="geral_conteudo">
    <div id="menu">
    </div>
    <div id="conteudo">
    </div>
    <div id="clear"></div>
</div>

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