Unwanted 1px space in Internet Explorer

Question

Unwanted 1px space in Internet Explorer

Asked 9 years, 1 month ago

Viewed 205 times

2

On my website, below the footer is a space of 1px that only occurs in Internet Explorer.
In my case, I’m using the IE-10. The footer has fixed positioning, I inserted it outside the container of the site, and put it back setting a negative lower margin to 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>

I want to remove this unwanted space in ie. In Dreamweaver, it also does not appear

– Harison

2015/09/22 at 21:54
I could not reproduce the problem, could provide an example in jsfiddle?

– Guilherme Nascimento

2015/09/22 at 22:31
I believe jsfiddle wouldn’t reproduce the problem, since it only occurs in internet explorer.

– Harison

2015/09/22 at 22:58
I’m using the Sticky footer technique.

– Harison

2015/09/22 at 23:02
@Harison jsfiddle is not a browser, it is an environment for you to reproduce your problem, so you send us the link and then we will open in Internetexplorer.

– Guilherme Nascimento

2015/09/22 at 23:10
http://hfoliveira.com.br/MAQUES/TESTE_RODAPE.html

– Harison

2015/09/22 at 23:26
The negative margin is still there ?

– Edilson

2015/10/03 at 23:59
Still remains.

– Harison

2015/10/04 at 00:17
Tried to make a clear:?

– ndroid

2015/10/08 at 20:51
The question lacks information. Impossible to reproduce.

– Daniel Omine

2015/10/09 at 07:29
question under discussion at meta http://meta.pt.stackoverflow.com/questions/4488/usu%C3%A1rio-com-multiplas-questions-similar

– Rafael Kendrik

2015/10/29 at 11:41

Show 6 more comments

2 answers

Browser other questions tagged html css

You are not signed in. Login or sign up in order to post.

by Maicon Carraro • **8,881** points · Answer 1 · 2015-09-22T21:56:00+00:00

You can use CSS Hack for this, example:

@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
}

by Tiago Gomes • **766** points · Answer 2 · 2015-10-06T17:06:24+00:00

Add to CSS

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

This code aims to reinforce that we do not want space between body and content.

Example.:

<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>