Não é possível obter CSS Fixo rodapé ao trabalho. O que estou fazendo de errado?

StackOverflow https://stackoverflow.com/questions/159487

  •  03-07-2019
  •  | 
  •  

Pergunta

Bem, este é meu primeiro post aqui e realmente desfrutar do local.

Eu tenho um site muito básico (feio como pecado) eu comecei e por alguma razão, eu não posso obter o CSS Fixo rodapé para o trabalho para o Firefox. IE funciona, mas mostra FF-lo até a metade da página.

A URL é http://dev.aipoker.co.uk

Eu sei que deveria estar desenvolvendo em FF e correção de bugs no IE, por isso estou supondo que eu poderia ter realmente cometi um erro e de alguma forma ele funciona no IE, mas em nenhum outro lugar.

alguém pode ajudar me colocou para fora da minha miséria, por favor?

Graças, rapazes e moças.

Foi útil?

Solução

Tente este um , ele funciona bem no Firefox.

BTW, você deve ouvir o podcast de Boagworld se você não já. É brilhante! :)

Felicidades.

Outras dicas

Eu tive sucesso com um código como este: 

footer { 
  display: block; 
  position: absolute; 
  width: 100%; 
  bottom: 0px; 
}

As alterações mínimas que eu posso ver de fazer isso seria:

  • move footerSection interior do corpo
  • posição definida absoluta sobre o corpo ea footerSection
  • bottom set = 0px em footerSection

que acaba com algo parecido com isso na sua cabeça: 

<style type="text/css">
  #body, #footerSection { position: absolute; }
  #footerSection { bottom: 0px; }
</style>

<div id="body">
   ...
   <div id="footerSection">
      ...
   </div>
</div>

Esta é tudo que você precisa saber sobre CSS apenas rodapés Sticky & navs pegajosas:

Vara a parte inferior da página 

Position: absolute;
top:auto;
bottom: 0;

Vara a parte inferior da tela 

Position: fixed;
top:auto;
bottom:0;

Todas as questões e é provavelmente devido ao local onde você colocou o seu código html (não faça o rodapé um elemento filho a menos que seja degola para o wrapper de conteúdo), ou sobreposição CSS.

Você pode aplicar a mesma técnica para navegação pegajoso lançando o auto & superior. It'sis cross browser compatível (Da memória do IE7 e acima), incluindo celulares.

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top