How to eliminate the space that require_once leaves?

2

When I use require_once to do the top-of-site inclusion, it leaves an upper space at about 8px, even in CSS I using body {         padding: 0;         margin: 0;         border: 0;     }; the problem remains.

Here is my complete CSS code:

body{
    padding: 0;
    margin: 0;
    border: 0;
}
.guaraparivirtual-topo {
position:relative;
width:1215px;
height:110px;
background-image:url(http://guaraparivirtual.com.br/novo-gv/logo.png);
background-repeat:no-repeat;
background-position:1% 50%;
margin: 0 auto;
background-color:#D5D5D5;
}

Now follow the full HTML and require_once :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="pt-br">
<meta name="description" content="Guarapari, Cidade Saude, guarapari es, espírito santo, fotos, verão, sol, mar, praias, tv, comidas tipicas, telefones úteis, horario de ônibus, turismo rural, empresas.">
<meta name="keywords" content="Brasil, Brazil, Guarapari, Cidade Saude, guarapari es, guarapari espírito santo, guarapari fotos, guarapari brasil, verão em guarapari">
<meta name="Author" content="Gladison Luciano Perosini" />
<meta name="reply-to" content="[email protected]" />
<meta name="robots" content="Follow" />
<title>:: Guarapari Virtual :: O Site da Cidade Saúde - Guarapari-ES</title>
<link href="guarapari-css.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" type="text/css" href="fonte.css">

</head>

<body>
<?php require_once('guarapari-topo-site-virtual.php'); ?>
</body>
</html>

Follow the require_once content as well:

<div class="guaraparivirtual-topo"></div>

All the files are there, but I could not find the problem.

If I take the contents of the include file and put it right on the page it works right and without the upper space, but I use the include file it gives this space.

Can you help me?

I await and thank you

    
asked by anonymous 19.05.2016 / 15:15

2 answers

1

I believe that the functions top and position can be used to "reinforce" the position at the top of the page.

I'll give you a small and simple example in using these functions, the example can be seen here or below.

div {
    width: 200px;
    height: 50px;
    margin-left: -100px; /* metade da largura */
    margin-top: 0px; /* metade da altura */
    position: absolute;
    top: 0%;
    left: 50%;
    border: 1px solid blue;
}
<div>
    Topo absoluto
</div>

The "secret" is in position: absolute; and in margin-top with the combination of top

    
19.05.2016 / 15:39
0

I tested it exactly as it has. Here is the image of my monitor:

I think there must be somewhere a margin / padding and has not noticed, or maybe have some property that acts on all the div

    
19.05.2016 / 15:34