Sticky footer not working in IE

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

Pergunta

I have created a Sticky footer for my website which you can view in this fiddle: http://jsfiddle.net/Aw6vn/

#main_Ticker{
    position: fixed;
    bottom: 0; 
    right: 12%;
    z-index: 6000 !important;
}

It works for all browsers in jsfiddle, but it doesn't work in IE8-9 when I placed the code in my page:

http://s-maof.com/PRO/index2.php?fkapp=2

I also tried :

position: absolute; bottom: 0; right: 12%;

which didn't do it.

Thanks to "My Head Hurts" , the solution was to edit out the commented headers

<!--<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">-->
<!--<!DOCTYPE HTML>-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

thanks!

Foi útil?

Solução

Remove the comments before !Doctype as these force IE to go into quirks mode (see here)

<!--<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">-->
<!--<!DOCTYPE HTML>-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Outras dicas

Add following in your style and try:

<style>
    *html, body {
        height: 100%;
    }
</style>
Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top