2

No meu site, abaixo do rodapé existe um espaço de 1px que só ocorre no Internet Explorer.
No meu caso, estou a usar o IE-10. O rodapé tem posicionamento fixo, eu inseri ele fora do container do site, e coloquei-o de volta definindo uma margem inferior negativa ao container.

.MASTER {
    width:1169px;
    margin-left: auto;
    margin-right: auto;
    /*margin-bottom:-228px;*/
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -228px;
}
.MT_SEM_SOMBRAS {
    width:1155px;
    margin-left:auto;
    margin-right:auto;
}
#fixer {
    width:1155px;
    height:228px;
    margin-left:auto;
    margin-right:auto;
    background-color:#FF0;
}
#push {
    margin-left:auto;
    margin-right:auto;
    width:1155px;
    height:228px;
}
<div id="MASTER">
    <div id="MT_SEM_SOMBRAS">
        Conteúdo do site
    </div>
</div>

<div id="fixer"> <!--este na verdade é o rodapé-->
    conteúdo com margem negativa
</div> 

11
  • Eu quero remover esse espaço indesejado no ie. No Dreamweaver, ele também não aparece
    – Harison
    Commented 22/09/2015 às 21:54
  • Não consegui reproduzir o problema, poderia fornecer um exemplo no jsfiddle?
    – Syzoth
    Commented 22/09/2015 às 22:31
  • acredito que no jsfiddle não reproduziria o problema, uma vez que ocorre apenas no internet explorer.
    – Harison
    Commented 22/09/2015 às 22:58
  • estou usando a técnica sticky footer.
    – Harison
    Commented 22/09/2015 às 23:02
  • @Harison jsfiddle não é um browser, é um ambiente pra você reproduzir o teu problema, então você envia o link pra gente e então iremos abrir no InternetExplorer.
    – Syzoth
    Commented 22/09/2015 às 23:10

2 Respostas 2

5

Você pode utilizar CSS Hack pra isso, exemplo:

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { 
   // apenas IE 10
   // aqui tu coloca a classe com a margin negativo pro IE
}
0

Adicionar ao CSS

body{
        margin:0 0 0 0;
        padding: 0 0 0 0;
    }

Este código tem o objectivo de reforçar que não pretendemos espaço entre o body e o conteúdo.

Exemplo.:

<html>
    <head>
        <meta charset="iso-8859-1">
        <title>Documento sem título</title>
        <style>
            body{
                margin:0 0 0 0;
                padding: 0 0 0 0;
            }
            #MASTER {
                width:1169px;
                height: 100%;
            }
            #MT_SEM_SOMBRAS {
                width:1155px;
                margin-left:auto;
                margin-right:auto;
                height:100%;
            }
            #fixer {
                clear:both;
                width:1155px;
                height:228px;
                margin-left:auto;
                margin-right:auto;
                background-color:#FF0;
            }
        </style>
    </head>

    <body>
        <div id="MASTER">
            <div id="MT_SEM_SOMBRAS">
                Conteúdo do site

            </div>

        </div>
        <div id="fixer"> <!--este na verdade é o rodapé-->
                conteúdo com margem negativa
        </div> 

    </body>
</html>
5
  • 2
    Seria bom se pudesse explicar pq esse código funciona ou qual é finalidade. :)
    – rray
    Commented 6/10/2015 às 17:33
  • Não funcionou...
    – Harison
    Commented 8/10/2015 às 15:18
  • Se calhar não percebi bem o constrangimento. O que percebi foi que entre o rodapé e o bottom do body existia 1px em branco no iexplorer 10 Commented 8/10/2015 às 16:52
  • É isso mesmo @TiagoGomes, conseguiu visualizar o problema?
    – Harison
    Commented 8/10/2015 às 22:43
  • Editei a resposta para colocar o html. Com este código continua a ter 1px entre o rodapé e o body? Commented 9/10/2015 às 12:57

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .