Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Boa noite a todos,
1º post.
Seguinte, sempre costumo fazer toda a página principal para depois "fatiar" e criar arquivos .php separados. Exemplo: topo.php, meio.php, rodape.php.
A página está perfeita e não possui erros com o CSS.
O problema é que ao inserir as partes via include surge um espaço abaixo da div.
Já testei no FF5 e IE9. O problema é o mesmo nos dois.
Me ajudem a resolver esse mistério.
site.css:
body {
margin: 0px;
padding: 0px;
background-color: #9B9B9B;
font-family:"Trebuchet MS", Arial, Verdana;
color: #000;
background-image: url(../img/bg_body.gif);
background-repeat: repeat-x;
}
#site {
width: 1024px;
margin: 0px auto;
}
#topo {
position: relative;
width: 1024px;
height: 125px;
margin: 0px auto;
background-image: url(../img/bg_topo.gif);
background-color: #EFEFEF;
}
#logo {
float: left;
margin: 0px auto;
width: 390px;
height: 125px;
}
#etopo {
float: left;
margin: 0px auto;
width: 634px;
height: 62px;
}
#home {
float: left;
width: 70px;
height: 37px;
}
#menu {
float: left;
width: 564px;
height: 37px;
}#menu ul {
margin: 0;
padding: 0;
list-style-type: none;
}#menu ul li a{
position: relative;
height: 25px;
display: inline;
float: left;
display: block;
border-right: 1px solid #555;
padding: 12px 16px 0px 16px;
text-decoration: none;
color: #FFF;
font-size: 12px;
font-weight: bold;
}#menu ul li a:hover{
background-image: url(/infosun/img/bg_menu.gif);
}
#navega {
float: left;
margin: 0px auto;
width: 634px;
height: 26px;
}
#util {
width: 1024px;
min-height: 400px;
background-color: #FFF;
}
#pub {
width: 1024px;
height: 240px;
background-color: #EFEFEF;
padding-top: 10px;
padding-bottom: 10px;
}
#box {
width: 1024px;
height: 240px;
background-image: url(/infosun/img/bg_pub.gif);
}
#solut {
width: 159px;
height: 220px;
float: left;
margin-left: 10px;
background-image: url(/infosun/img/box_solut.png);
background-position: center;
background-repeat: no-repeat;
}
#listasolu {
height: 100px;
color: #000;
font-size: 11px;
list-style-image: url(/infosun/img/marcador.png);
}
.maisinfo {
margin-left: 10px;
font-size: 11px;
text-align: right;
margin-right: 10px;
font-weight: bold;
}.maisinfo a{
color: #556aae;
}.maisinfo a:hover{
color: #b44718;
}
#more {
width: 1024px;
min-height: 300px;
}
#news {
width: 340px;
height: 300px;
float: left;
background-color: #EFEFEF;
}
#apresenta {
width: 514px;
height: 300px;
float: left;
background-color: #D8D8D8;
}
#parceiros {
width: 170px;
height: 300px;
float: right;
background-color:#C6C6C6;
}
#rodape {
margin: 0px;
width: 100%;
height: 200px;
background-color: #000;
}
#rodape_item {
margin: 0px auto;
width: 1024px;
height: 200px;
}
#rodape_itema {
float: left;
width: 341px;
height: 200px;
font-size: 13px;
list-style-image: url(/infosun/img/marcador2.png);
line-height: 25px;
}#rodape_itema a {
color: #FFF;
text-decoration: none;
}#rodape_itema a:hover {
color: #df8b1e;
text-decoration: none;
}
#rodape_itemb {
float: left;
color: #FFF;
font-size: 12px;
width: 342px;
height: 200px;
}
#rodape_itemc {
float: right;
width: 341px;
height: 200px;
color: #FFF;
font-size: 12px;
text-align: right;
}
.copyright {
color: #df8b1e;
font-style: italic;
}index.php:
<!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" />
<title>Documento sem título</title>
<link href="inc/site.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="site">
<div id="topo">
<div id="logo"><img src="img/logo.png" alt="InfoSun" width="372" height="120" title="A solução em TI completa para a sua empresa"/></div>
<div id="etopo"></div>
<div id="home"><a href="index.php" target="_parent"><img src="img/home.gif" alt="Home" width="70" height="37" border="0"/></a></div>
<div id="menu">
<ul>
<li><a href="index.php" target="_parent">Quem Somos</a></li>
<li><a href="index.php" target="_parent">Soluções</a></li>
<li><a href="index.php" target="_parent">Clientes</a></li>
<li><a href="index.php" target="_parent">Downloads</a></li>
<li><a href="index.php" target="_parent">Contato</a></li>
</ul>
</div>
<div id="navega"></div>
</div>
<div id="util">
<div id="pub"><img src="img/banner.jpg" alt="InfoSun" width="1024" height="220" title="A solução em TI completa para a sua empresa"/>
<img src="img/title_destaques.png" alt="Destaques" width="110" height="30"/>
</div>
<div id="box"></div>
<div id="more">
<div id="news"><img src="img/title_news.png" alt="Novidades" width="110" height="30"/></div>
<div id="apresenta"><img src="img/title_apresenta.png" alt="Apresentação" width="110" height="30"/></div>
<div id="parceiros">
<img src="img/title_parceiros.png" alt="Parceiros" width="110" height="30"/>
<p><img src="img/logo_kaspersky.png" alt="Kaspersky" width="170" height="35"/></p>
<p><img src="img/logo_microsoft.png" alt="Microsoft" width="170" height="35"/></p>
</div>
</div>
</div>
</div>
<? include ('rodape.php'); ?>
</body>
</html>rodape.php
<div id="rodape_item">
<div id="rodape_itema">
<ul>
<li><a href="index.php" target="_parent">Quem Somos</a></li>
<li><a href="index.php" target="_parent">Soluções</a></li>
<li><a href="index.php" target="_parent">Clientes</a></li>
<li><a href="index.php" target="_parent">Downloads</a></li>
<li><a href="index.php" target="_parent">Contato</a></li>
</ul>
</div>
<div id="rodape_itemb"></div>
<div id="rodape_itemc">
<p>Endereço</p>
<p><img src="img/fone.png" align="absmiddle"/> <b>55</b></p>
<p class="copyright">Copyright© 2011 Empresa</p>
</div>
</div>Carregando comentários...