Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Aikon

Espaço fantasma no fim da pagina

Recommended Posts

Eu estou estudando css bastante, e agora surgiu um problema, eu to fazendo um site todo em "position:relative" pq ai se o conteudo de uma caixa aumenta as outras caixas acompanham, em vez dessa caixa mais ficar em cima das outras.

 

O problema q eu estou tendo é que fica um espaço dps do rodapé do mesmo tamanho do site, só que vazio, como se as divs ainda estivessem la:

 

o codigo:

<!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=iso-8859-1" /><meta http-equiv="content-language" content="pt-br" /><meta name='author' content='CLR Informática - Lucas B. Souza' /><meta name='description' content='Consladel, Construtora de Laços e Detetores LTDA' /><meta name='keywords' content='construção, construções, construcao, construcoes, construtora, contrustoras, laços, lacos, laço, laco, detetores, detetor, sinalização, sinalizações, sinalizacao, sinalizacoes, viaria, viarias, ruas, rua, estradas, estrada, avenidas, avenida, pedagios, pedagio, transito, transitando, placas, placa, faixa, faixas'/><title>Consladel - Construtora de Laços e Detetores LTDA.</title><style type="text/css">* {margin:0px;padding:0px;}body {	background-image:url(images/fundo_all.jpg);}#pai, #topo, #logotipo, #menu, #busca, #dbusca, #noticias, #dnoticias, #webmail, #bemvindo, #dbemvindo, #clientes, #dclientes, #empresa, #dempresa, #propaganda, #rodape {position:relative;}#dbusca, #dnoticias, #dclientes, #dempresa {background-color:#EFEFEF}#busca, #noticias, #bemvindo, #clientes, #empresa {background-color:#E0E0E0}#pai {width:778;height:805;}#topo {width:778px;height:220px;background-image:url(images/fundo_topo.jpg);}#logotipo {width:199px;height:202px;left:65px;}#menu {width:514px;height:61px;left:264px;top:131px;position:absolute;}#busca {width:225px;height:111px;left:6px;top:5px;}#dbusca {width:217px;height:104px;left:4px;top:4px;margin-bottom:8px;}#noticias {width:225px;height:277px;left:6px;top:12px;}#dnoticias {width:217px;height:269px;left:4px;top:4px;margin-bottom:8px;}#webmail {width:224px;height:84px;left:6px;top:18px;}#bemvindo {width:533px;height:159px;left:237px;top:-468px;}#dbemvindo {background-image:url(images/fundo_bemvindo.jpg);width:525px;height:151px;left:4px;top:4px;margin-bottom:8px;}#clientes {width:262px;height:320px;left:237px;top:-462px;}#dclientes {width:252px;height:312px;left:4px;top:4px;margin-bottom:8px;}#empresa {width:263px;height:224px;left:506px;top:-782px;}#dempresa {width:254px;height:216px;left:4px;top:4px;margin-bottom:8px;}#propaganda {width:264px;height:91px;left:506px;top:-775px;}#rodape {border-top:4px solid #333;text-align:center;width:764px;height:95px;left:6px;top:-770px;}</style></head><body><div id="pai">	<div id="topo">		<div id="logotipo"><img src="images/logotipo.jpg" alt="Consladel - Construtora de Laços e Detetores LTDA." width="199" height="202" /></div>		<div id="menu"><img src="images/menu.jpg" alt="Menu" /></div>	</div>		<div id="busca">		<div id=dbusca><img src="images/busca.jpg" alt="Busca" width="217" height="26" /></div>	</div>		<div id="noticias">		<div id="dnoticias"><img src="images/noticias.jpg" alt="Notícias" width="217" height="28" /></div>	</div>		<div id="webmail"><img src="images/webmail_btng.jpg" alt="Webmail" width="224" height="84" /></div>		<div id="bemvindo">		<div id="dbemvindo"></div>	</div>		<div id="clientes">		<div id="dclientes"><img src="images/clientes.jpg" alt="Clientes" width="254" height="28" /></div>	</div>	  <div id="empresa">		<div id="dempresa"><img src="images/empresa.jpg" alt="Empresa" width="254" height="28" /></div>  </div>		<div id="propaganda"><img src="images/propaganda.jpg" alt="Propaganda" width="262" height="89" /></div>	  <div id="rodape"></div>	</div></body></html>

e o link: aqui

 

e eu tmb tenho outro problema, se eu adiciono muito conteudo na div clientes, eu queria q as outras ficassem paradas e só o rodapé acompanhasse a div clientes... mas a div empresa e propaganda tmb descem junto =x (eu poderia fazer todas elas absolute e deixar só o rodape relative, só q se eu aumentar a div bem vindo, quero que empresa e clientes acompanhem ela)

 

vlw http://forum.imasters.com.br/public/style_emoticons/default/closedeyes.gif

Compartilhar este post


Link para o post
Compartilhar em outros sites

Não entendi o "um site todo em "position:relative"".

Pelo link que você passou, pode fazer com o layout de duas colunas que tem no Lab de Scripts WS.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Cara uma coisa eu não vi em seu rodape isto

clear:both;

Eu creio que um dos problemas você iraa resolver os outros vou pensar melhor pois uma div que tem que ficar de ponta a ponta do site tem que ter clear:both; foi isto que me falaram no meu curso e no meu site tava um problema parecido e só resovi assim.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Cara, clear:both é pra limpar a linha.. não tem a ver isso que você falou.. normalmente é posto esta tag quando alguma outra div está sobrepondo uma qualquer que não deveria.como o Pedradegelo disse em um uma outra explicação:

bom, o clear:both é necessário para corrigir marcações posteriores a outras, eu adoro usar depois daqueles 3 divs, tipo menu, meio, e lado direito que flutuam, uma linha <br sytle="clear:both" />

em: http://www.imasters.com.br/forum/lofiversi...hp/t215536.htmlmas isso não é regra..voltando ao nosso problema do tópico =>
#pai {width:778px;height:100px;}
tem certeza que tu está fazendo algo correto.. digo correto por que não tem muito sentido nomear tudo como relative =~~mas enfim.. a solução pro seu problema é coloca "px" no final do tamanho da #pai ;D ahahahaabração!

Compartilhar este post


Link para o post
Compartilhar em outros sites

Pesquise antes de responder Brunolc. Se for para escrever qualquer coisa, é bom nem escrever, pode confundir muita gente.

Definição http://forum.imasters.com.br/public/style_emoticons/default/seta.gif http://www.w3schools.com/css/pr_class_clear.asp

 

Cara uma coisa eu não vi em seu rodape isto

clear:both;

Eu creio que um dos problemas você iraa resolver os outros vou pensar melhor pois uma div que tem que ficar de ponta a ponta do site tem que ter clear:both; foi isto que me falaram no meu curso e no meu site tava um problema parecido e só resovi assim.

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Não preciso pensar antes pois estava com um problema parecido com o dele não aparecia as divs no fire fox ficava um vazio e coloquei e resolveu.

Compartilhar este post


Link para o post
Compartilhar em outros sites

vlw todo mundo pelas respostas ^_^e gio, vlw pela ideia do site em duas colunas, funcionou bem, cada vez q eu refaço o meu site parece q ele fica mais simples :P*\o/*

Compartilhar este post


Link para o post
Compartilhar em outros sites

E cada vez vai ficar mais fácil mesmo! http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif Precisando de ajuda, por favor, volte a postar. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

e gio, vlw pela ideia do site em duas colunas, funcionou bem, cada vez q eu refaço o meu site parece q ele fica mais simples :P

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.