include atribuino margin

lordlexx · Março 30, 2011

olá amigos do forum tudo beleza? seguinte estava separando o layout do site para puxa-los por include separado header conteudo etc so q esta dano um problema qnd atribuo o include <?php include_once("header.php");?> simplismente aparece um baita margin em cima no topo :( com o header normal na pagina fica normal pq sera q esta dano esse espaço no topo qnd coloco o header em um include verificano o css nao aparenta nenhum erro esta zerado os margin e padding *{margin:0;paddin:0;}

se alguem puder ajudar nesse problema

se colocar tbm o conteudo num include e puxar no meio ele da tbm um espaço acima =/

vlw ajuda pessoal

willwalker · Março 30, 2011

Posta o seu arquivo header.php e o arquivo que está recebendo o include. Porque o código não erra, quem erra e buga é o programador! =D

lordlexx · Março 30, 2011

pois e amigo willwalker me esqueci de postar o codigo =P

ta assim o index sem repartir pra criar os include

<!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>Classifácil Paraíso - O Seu Portal das Oportunidades</title>
<link href="estilo.css"rel="stylesheet" type="text/css" />
</head>

<body>
<div id="box">
<div id="topo">
</div><!--fecha topo-->
<div id="cabecalho">
<div id="header">
<div id="login">
<img src="imagens/assets/loginimg.png" /><h1>Central do anunciante</h1>

<form action="" method="post">
<label>
<span>Email:</span>
<input type="text" />
</label>
<label>
<span style="margin:2px 0;">Senha:</span>
<input type="password"  class="senha"/>
</label>
<input type="submit" name="" value="Logar"class="btn"  />
</form>
<p><a href="#">[ Esqueci minha senha ]</a></p>
</div><!--fecha login-->
<div id="atendimento_on">
<img src="imagens/assets/atendimentoimg.png" />
</div><!--fecha atendimento-->
</div><!--fecha header-->
<div id="anuncie">
<h1>Envie seu anúncio</h1>
<a href="#">Clique aqui</a>
<p>Anunciar no Classifácil Paraíso e gratis
ainda você tem
a melhor maneira de vender  
ou comprar seu imovel, 
veiculo ,eletrônico etc.
</p>
</div><!--fecha anuncie-->
<div id="publicidade">
<h1>Publicidade</h1>

</div><!--fecha publicidade-->

</div><!--fecha cabecalho-->
<div id="menu_home">
<a href="#">Home</a>
<a href="#">Anunciar</a>
<a href="#">Imóveis</a>
<a href="#">Veículos</a>
<a href="#">Empregos</a>
<a href="#">Fale Conosco</a>
</div><!--fecha menuhome-->
<div id="anuncios_home">
<h1>Anuncios</h1>
<form method="post" action="" name="">
<label>
<span>Busca comun:</span>
<input type="text"  name="s" />
<input type="submit" value="Encontrar"  class="btn"/>

</label>
</form>
<ul class="lista_um">
<li>
<img src="imagens/midias/imghome.jpg" alt="" title="" border="0" />
<h2><a href="#">Vendo apartamento</a></h2>
<h3><a href="#">Venda</a></h3>
<a href="#"  class="vejamais_g">Veja mais</a>

</li>
<li>
<img src="imagens/midias/imghome.jpg" alt="" title="" border="0" />
<h2><a href="#">Vendo apartamento</a></h2>
<h3><a href="#">Venda</a></h3>
<a href="#"  class="vejamais_g">Veja mais</a>

</li>
<li>
<img src="imagens/midias/imghome.jpg" alt="" title="" border="0" />
<h2><a href="#">Vendo apartamento</a></h2>
<h3><a href="#">Venda</a></h3>
<a href="#"  class="vejamais_g">Veja mais</a>

</li>
<li>
<img src="imagens/midias/imghome.jpg" alt="" title="" border="0" />
<h2><a href="#">Vendo apartamento</a></h2>
<h3><a href="#">Venda</a></h3>
<a href="#"  class="vejamais_g">Veja mais</a>

</li>


</ul>
<ul class="lista_dois">
<li>
<img src="imagens/midias/imghome.jpg" alt="" title=""  border="0"/>
<h2><a href="#">Vendo apartamento</a></h2>
<h3><a href="#">Venda</a></h3>
<a href="#" class="vejamais_g">Veja mais</a>


</li>
<li>
<img src="imagens/midias/imghome.jpg" alt="" title=""  border="0"/>
<h2><a href="#">Vendo apartamento</a></h2>
<h3><a href="#">Venda</a></h3>
<a href="#" class="vejamais_g">Veja mais</a>

</li>
<li>
<img src="imagens/midias/imghome.jpg" alt="" title=""  border="0"/>
<h2><a href="#">Vendo apartamento</a></h2>
<h3><a href="#">Venda</a></h3>
<a href="#" class="vejamais_g">Veja mais</a>


</li>
<li>
<img src="imagens/midias/imghome.jpg" alt="" title=""  border="0"/>
<h2><a href="#">Vendo apartamento</a></h2>
<h3><a href="#">Venda</a></h3>
<a href="#" class="vejamais_g">Veja mais</a>


</li>

</ul>
<div style="clear:both"></div>

</div><!--fecha anuncios_home-->

<div id="anuncios_lista">
<ul>
<li>
<a href="#"><img src="imagens/midias/imghome2.jpg" alt="" title="" border="0" /></a>
<h2> <a href="#">Vendo casa</a></h2>
<h3><a href="#">Venda</a></h3>
<a href="#" class="vejamais_p">Veja mais</a>
</li>
<li>
<a href="#"><img src="imagens/midias/imghome2.jpg" alt="" title="" border="0" /></a>
<h2> <a href="#">Vendo casa</a></h2>
<h3><a href="#">Venda</a></h3>
<a href="#" class="vejamais_p">Veja mais</a>
</li>
<li>
<a href="#"><img src="imagens/midias/imghome2.jpg" alt="" title="" border="0" /></a>
<h2> <a href="#">Vendo casa</a></h2>
<h3><a href="#">Venda</a></h3>
<a href="#" class="vejamais_p">Veja mais</a>


</li>
<li>
<a href="#"><img src="imagens/midias/imghome2.jpg" alt="" title="" border="0" /></a>
<h2> <a href="#">Vendo casa</a></h2>
<h3><a href="#">Venda</a></h3>
<a href="#" class="vejamais_p">Veja mais</a>


</li>
<li>
<a href="#"><img src="imagens/midias/imghome2.jpg" alt="" title="" border="0" /></a>
<h2> <a href="#">Vendo casa</a></h2>
<h3><a href="#">Venda</a></h3>
<a href="#" class="vejamais_p">Veja mais</a>


</li>

</ul>


</div><!--fecha anuncios_lista-->
<div style="clear:both"></div>
<div id="footer">
a
</div>

</div><!--fecha box -->





<div style=" display:none"><img src="imagens/assets/loginbghover.png" /></div>
</body>
</html>

aew o css esta assim

@charset "utf-8";
/* CSS Document */
*{margin:0; padding:0;}
body{ background:#fff;}
#box{width:1002px; margin:0 auto; background-color:#fff; }

/*header*/
#topo{ width:1002px;height:150px; background: url(imagens/testetopoimg.jpg) no-repeat; border-bottom:5px solid #004364; }
#cabecalho { width:1002px; height:250px; background:#FC0;}
#header{ height:250px; width:280px; background-color: #333; float:left;}
#login{ width:262px; height:121px; background:url(imagens/assets/bglogin.jpg) no-repeat; margin:3px 12px;}
#login img{margin:10px 5px 0 15px; float:left;}
#login h1{ font:18px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#004364; float:left; font-variant:small-caps; font-weight:bold; margin:8px 5px;}
#login p{ clear:both;}
#login form {float:left;}
#login form label { display:block; margin:3px 15px;}
#login form span{ font:12px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#004364; font-variant:small-caps; font-weight:bold;}
#login form input{ width:180px;}
#login form label .senha{width:100px; float:left; margin:2px 0;}
#login form label span{ float:left;}
#login form .btn{ width:70px; height:24px; float:left; background: url(imagens/assets/loginbg.png) no-repeat; border:0; margin:0 5px; cursor:pointer; font:14px  Arial, Helvetica, sans-serif; color:#004364; font-weight:bold;}
#login form .btn:hover{ background:url(imagens/assets/loginbghover.png) no-repeat; color:#FFF;}
#login  p{ text-align:center; font:14px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#666; padding:3px 0;}
#login p a{ text-decoration:none; color:#666;}
#login p a:hover{ text-decoration:underline;}

#atendimento_on{width:262px; height:104px; background:url(imagens/assets/bgatendimento.jpg) no-repeat;margin:3px 12px }
#atendimento_on img { margin:15px 5px;}

#anuncie { width:408px; height:225px; background:url(imagens/assets/bganuncie.jpg) no-repeat; float:left; margin:4px 0;}
#anuncie h1{ font:24px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#004364; font-weight:bold; margin:25px 35px 0px 35px;}
#anuncie a{ background:url(imagens/assets/anunciebotao.png) no-repeat; width:140px; height:25px; float:left; display:block; font:14px "Trebuchet MS", Arial, Helvetica, sans-serif;  color:#004364; padding:8px 8px 8px 6px ; text-align:center; text-decoration:none; font-weight:bold; margin:15px 50px 0px 60px;}
#anuncie a:hover{ text-decoration: underline;}
#anuncie p{font:12px "Trebuchet MS", Arial, Helvetica, sans-serif;  color: #666; float:left; text-align:center; padding:10px 140px 0 25px; font-weight:bold;}

#publicidade{ width:300px; height:250px; background-color:#fff; float:left; margin:0 0 0 5px;}
#publicidade h1 { font:14px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#004364; font-size:14px; font-variant:small-caps; font-weight:bold; margin:5px 10px; border-bottom:1px solid #004364;}
#publicidade .publicidadeimg{ width:280px; height:200px; background-color:#CCC; margin:0 10px;}

/*menu*/
#menu_home{ width:1002px; height:40px; background: url(imagens/assets/bgmenu.jpg) repeat-x; border-bottom:5px solid #004364;}
#menu_home a{ text-decoration:none; font:20px  "Trebuchet MS", Arial, Helvetica, sans-serif; color:#fff; padding:8px 30px ; display: inline; float:left;}
#menu_home a:hover{ background:url(imagens/assets/menubghover.jpg) repeat-x; color:#004364;}




/*conteudo*/
#anuncios_home{ width:1002px; background:url(imagens/assets/buscaareabacground.jpg) top no-repeat #fff; border-bottom:5px solid #004364; padding:0 0 10px 0 ;}

#anuncios_home h1{font:30px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#004364; font-weight:bold;margin:3px 0 0 70px; float:left; }

#anuncios_home form{ float:right;}
#anuncios_home label{display:block;}
#anuncios_home span{font:18px Arial, Helvetica, sans-serif; color:#fff;}
#anuncios_home input{width:371px; height:21px; background: url(imagens/assets/buscabginput.png) no-repeat; border:0; outline:none; padding:2px 0px 2px 8px; font:14px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#004364;}
#anuncios_home .btn{width:80px; height:25px; background: url(imagens/assets/botaoencontrarbg.png)  no-repeat; border:none; cursor:pointer; font:14px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#004364; padding:0 2px 0 0; font-weight:bold; margin:0 5px 0 0;}
#anuncios_home a{ text-decoration:none;}
#anuncios_home a:hover{ text-decoration:underline;}
#anuncios_lista a{ text-decoration:none;}
#anuncios_lista a:hover{ text-decoration:underline;}

#anuncios_home .lista_um{ list-style:none; float:left; width:1002px; margin-bottom:5px; padding-bottom:5px; border-bottom:1px solid #ccc;}
#anuncios_home .lista_um li{ display:inline; float:left; text-align:center; margin:10px 10px;} #anuncios_home .lista_um li:hover{ background:#f4f4f4;}
#anuncios_home .lista_um li img{}
#anuncios_home .lista_um li h2 a{font:18px Arial, Helvetica, sans-serif; color:#004364; font-weight:bold;}
#anuncios_home .lista_um li h3 a{font:16px Arial, Helvetica, sans-serif; color:#666; }
#anuncios_home .lista_um li .vejamais_g{ width:100px; height:17px; float:left; background:url(imagens/assets/botao_vejamais_g.png) no-repeat;; padding:8px 5px ; font:14px Arial, Helvetica, sans-serif; color:#333; font-weight:bold; margin:5px 60px;}
#anuncios_home .lista_um li .vejamais_g:hover{ color:#09C;}

#anuncios_home .lista_dois{ list-style:none; float:left; width:1002px;}
#anuncios_home .lista_dois li{ display:inline; float:left; text-align:center;margin:10px 10px;}
#anuncios_home .lista_dois li:hover{ background:#f4f4f4;}
#anuncios_home .lista_doisli img{}
#anuncios_home .lista_dois li h2 a{font:18px Arial, Helvetica, sans-serif; color:#004364; font-weight:bold;}
#anuncios_home .lista_dois li h3 a{font:16px Arial, Helvetica, sans-serif; color:#666; }
#anuncios_home .lista_dois li .vejamais_g{ width:100px; height:17px; float:left; background:url(imagens/assets/botao_vejamais_g.png) no-repeat;; padding:8px 5px ; font:14px Arial, Helvetica, sans-serif; color:#333; font-weight:bold; margin:5px 60px;}
#anuncios_home .lista_dois li .vejamais_g:hover{ color:#09C;}

#anuncios_lista{ list-style:none; float:left; width:1002px; margin-bottom:5px; padding-bottom:5px;  }
#anuncios_lista li{ display:inline; float:left; text-align:center; margin:8px 0; } 
#anuncios_lista li:hover{ background:#f4f4f4;}
#anuncios_lista .lista_um li img{}
#anuncios_lista li h2 a{font:14px Arial, Helvetica, sans-serif; color:#004364; font-weight:bold;}
#anuncios_lista li h3 a{font:12px Arial, Helvetica, sans-serif; color:#666; }
#anuncios_lista  li .vejamais_p{ width:70px; height:18px; float:left; background:url(imagens/assets/botao_vejamais_p.png) no-repeat;;  font:12px Arial, Helvetica, sans-serif; color:#333; font-weight:bold; margin:5px 60px; padding:5px 5px;}
#anuncios_lista li .vejamais_p:hover{ color:#09C;}



/*rodape*/
#footer{height:100px; width:1002px; background: #0F0; border-top:5px solid #004364;}

aew pra montar os include index ja partido

<?php include_once("header.php");?>
<?php 
foreach ($_REQUEST as $___opt => $___val) {
 $$___opt = $___val;
}
if(empty($pg)) {
include("navegar/home.php");
}
elseif(substr($pg, 0, 4)=='http' or substr($pg, 
0, 1)=="/" or substr($pg, 0, 1)==".") 
{
echo '<br><font face=arial size=11px><br><b>A página não existe.</b><br>Por favor selecione uma página a partir do Menu Principal.</font>'; 
}
else {
include("navegar/$pg.php");
}

?>
<?php include_once("footer.php");?>

aew ta dano um margin em cima nao descobri pq =/ se for necessario coloco onde reparti o codigo pra montar os includes

vlw ajuda

header.php esta dano uma espaço tbm acima do PHP do conteudo

<!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>Classifácil Paraíso - O Seu Portal das Oportunidades</title>
<link href="estilo.css"rel="stylesheet" type="text/css" />
</head>

<body>
<div id="box">
<div id="topo">
</div><!--fecha topo-->
<div id="cabecalho">
<div id="header">
<div id="login">
<img src="imagens/assets/loginimg.png" /><h1>Central do anunciante</h1>

<form action="" method="post">
<label>
<span>Email:</span>
<input type="text" />
</label>
<label>
<span style="margin:2px 0;">Senha:</span>
<input type="password"  class="senha"/>
</label>
<input type="submit" name="" value="Logar"class="btn"  />
</form>
<p><a href="#">[ Esqueci minha senha ]</a></p>
</div><!--fecha login-->
<div id="atendimento_on">
<img src="imagens/assets/atendimentoimg.png" />
</div><!--fecha atendimento-->
</div><!--fecha header-->
<div id="anuncie">
<h1>Envie seu anúncio</h1>
<a href="#">Clique aqui</a>
<p>Anunciar no Classifácil Paraíso e gratis
ainda você tem
a melhor maneira de vender  
ou comprar seu imovel, 
veiculo ,eletrônico etc.
</p>
</div><!--fecha anuncie-->
<div id="publicidade">
<h1>Publicidade</h1>

</div><!--fecha publicidade-->

</div><!--fecha cabecalho-->
<div id="menu_home">
<a href="#">Home</a>
<a href="#">Anunciar</a>
<a href="#">Imóveis</a>
<a href="#">Veículos</a>
<a href="#">Empregos</a>
<a href="#">Fale Conosco</a>
</div><!--fecha menuhome-->

willwalker · Março 30, 2011

Manda um print screen. Acho que sei o problema.

lordlexx · Março 30, 2011

estava testano sem conteudo so com div e esta dano o mesmo problema vo posta o codigo q esta bem menor pode fica rmais facil para ajudar e uma print

codigo index

<?php include_once("header.php"); ?>
<?php include_once("home.php"); ?>
<?php include_once("footer.php"); ?>

codigo css

@charset "utf-8";
/* CSS Document */
*{margin:0; padding:0;}
body{ background: #6FF;}
#box{width:1002px; margin:0 auto; background-color:#fff; }
#topo{ height:150px; background:#093; margin:0; padding:0;}
#anuncios_home{ height:500px; background:#339;}
#footer{ height:130px; background:#963;}

codigo header

<!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>Classifácil Paraíso - O Seu Portal das Oportunidades</title>
<link href="estilo.css"rel="stylesheet" type="text/css" />
</head>
<body>
<div id="box">
<div id="topo"></div><!--fecha topo-->

codigo conteudo

<div id="anuncios_home">
a
</div><!--fecha anuncios_home-->

codigo rodape

<div id="footer">
a
</div><!--fecha footer-->

</div><!--fecha box -->
</body>
</html>

print

http://img43.imageshack.us/i/printjn.jpg/

ta dano um espaço no conteudo tbm so q nao aparece na print muito estranho esse problema azul claro e o body o branquinho sao os espaços

vlw

willwalker · Março 30, 2011

Tu vai estruturar suas páginas assim:

header.php

<?php //Scripts php somente - includes de conexão, ou session_start(); por exemplo ?>

index.php (arquivo que vai conter todos os includes)


<?php include("header.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>Untitled Document</title>
<link href="estilo.css"rel="stylesheet" type="text/css" />
</head>

<body>
<?php include("topo.php"); ?>
<div id="box">

<!-- Aqui fica o código da sua página home -->

<?php include("rodape.php"); ?>
</div><!--fecha box -->
</body>
</html>

topo.php (onde contem menus essas coisas)

rodape.php

<div id="footer">a</div><!--fecha footer-->

E o index.php tu vai usar para criar qualquer página do seu site. Mudando somente essa linha -

Abraços Walker

lordlexx · Março 30, 2011

vlw ajuda amigo Walker mas nao esta dano eu tirei o header e o footer e so coloquei o conteudo como include e esta dano o espaço ainda eita q coisa nao consigo entender o pq desse espaço qnd usa include esta quebrano o layout mesmo so com as divs sem nada de conteudo como postei acima esta dano esse espaço como posso fazer pra remover eses espaços?

obrigado

willwalker · Março 31, 2011

Faz assim, me manda os arquivo e me adiciona no msn que eu te ajudo com isso ai. wilzinho2901 @ hotmail . com

Abraços Walker

lordlexx · Abril 4, 2011

vlw amigo Walker te add la parece q descobri +ou- oq causa o problema qnd tem alguma div dentro da pagina q sera o include aparece esse espaço afe nao sei o pq disso se eu deixar sem div aew some o espaço :( em um codigo simples sem nada somente as divs q estou testano

aqui esta o site somente as divs nao tem conteudo perceba o layout certinho tudo esta no index

http://teste.classifacilparaiso.com/

agora vou remover a div conteudo q e a azul meio e vou coloca-la como include sendo puxada para o index vou por a tag div id conteudo no include percebe-se q vai dar um espaço acima (em cinza) parecido com um marging aew o texto ira descer esse espaço q e o problema qnd tem alguma div no include (falo no arquivo q sera puxado) ele da esse espaço pq sera? favor acessar abaixo para verificar como fica

http://teste.classifacilparaiso.com/otro/

obrigado pela ajuda pessoal

alguem saberia informar como resolver esse problema ou se nos links acima esta tendo mesmo o problema

vlw

ecolagos · Janeiro 2, 2012

bom pessoal.. estava com o mesmo problema e consegui resolver..

eu abri o dreamweaver crtl+J e salvei a codificação utf-8 sem bom..

repeti o processo no notepad ++ pra me certificar..

depois joguei o include na primeira linha do documento, antes mesmo de declarar o doctype..

deu certo..

estou trabalhando em localhost senão postava pra vcs verem...

brigadão wilker..

Kaique Merlo · Julho 3, 2012

Amigo ecolagos,

tive que me cadastrar no forum para agradecer sua ajuda

estava com o mesmo problema,estava quebrando a cabeça e graças a voce

consegui arrumar o problema, um simples utf 8 sem bom resolveu rs

Obrigadão!

Arquivado

include atribuino margin

Recommended Posts

lordlexx 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

willwalker 2

Compartilhar este post

Link para o post

Compartilhar em outros sites

lordlexx 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

willwalker 2

Compartilhar este post

Link para o post

Compartilhar em outros sites

lordlexx 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

willwalker 2

Compartilhar este post

Link para o post

Compartilhar em outros sites

lordlexx 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

willwalker 2

Compartilhar este post

Link para o post

Compartilhar em outros sites

lordlexx 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

ecolagos 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Kaique Merlo 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

printf iniciante básico

JAVA - Orientação para Invalidar Sessão

JAVA - Ajuda em Paginação

Fóruns

Tempo Real

Informação importante