Rodapé não fica no fim da página

Bom dia Pedro, tudo certo?

Analisando seu código percebi que você está usando o dentro da , se ele for o footer do site inteiro, coloque-o fora.

Outra coisa... Você está usando "position: absolute;" e bottom: 0;, como você não tem position relative em nenhum elemento pai dele, ele vai referenciar para o Body, e assim acompanhar o scroll, dando impressão de fixado na parte inferior do site.

Coloque-o fora da tag , mais precisamente no mesmo nivel do seu , e mude o position para relative ou pode tirar a position dele.

Me deixe saber se posso te ajudar em alguma outra coisa, forte abraço.

.rodape {
  background-color: black;
  color: white;
  position: absolute;
  bottom:0;
  width:100%;
  margin: auto auto;
  padding: 10px 5px;
}

Ele agora foi pra baixo do form, acima do botão. Coisa ta maluca. auhauahuahua

E ai pedro! Eu tirei o footer da tag main e coloquei ele dentro de uma div. No CSS coloquei margin-top: 80px na div; e mudei a possition da classe rodapé pra relative.

como assim? tu botou o footer inteiro dentro de uma div?

</main>
<div>
<footer>
...
</footer>
</div>

isso?

ficou melhor mais ainda nao ficou no pé da pagina.

Exatamente assim, mas no CSS muda o position do footer pra relative e no da div adiciona uma margin-top de 80px, aqui como fiz:

.rodape {
    background-color: black;
    color: white;
    position: relative;
    bottom: 0;
    width: 100%;
    margin: auto auto;
    padding: 10px 5px;
.divrodape {
    margin: 80px 0 0 0;
}

Mas botar uma div dentro de uma div pq? Botar esse margin direto no . rodape não daria na mesma?

Coloca um clear:both; no css do rodapé? pode ajudar, como você tem elementos com float =o

Visualmente sim, o caso da div é mais um costume pessoal, assim eu separo aquela região como um bloco e fica mais fácil de manipular os elementos caso eu queira adicionar mais coisas. Acho que o Thiago Rodrigues arrumou uma solução melhor. Vlw Thiago não conhecia o clear.

=D, é uma propriedade bem legal, e sempre que vc for mexer com float e a página estiver meio estranha, da uma olhada nele. Ele literalmente garante que não vão ter elementos do tipo float a esquerda daquele elemento ou a direita, clear: left; clear:right ou clear:both

obrigado, acho que nao vai ate o pé da pagina pq nao tem muito conteúdo da página, teria que empurrar "manualmente".

Vou marcar como resolvido =) Obrigado Gente