Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Saudações, pessoal! :D
Odeio mexer com design. Meu negócio é programar, mas às vezes temos que fazer uns sacrifícios, né...? :D
Estou utilizando aquele tutorial do Maujor sobre como centralizar uma página na tela, mas está ficando um espaço em branco abaixo da div conteudo, entre ela e o rodapé.
Os códigos HTML e CSS são estes:
padores.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">http-equiv="content-type" content="text/html; charset=iso-8859-1" /><link rel="stylesheet" href="padroes.css" type="text/css" /><title>Padrões</title></head><body><div id="tudo"><div id="topo"><h1>Topo</h1></div><div id="menuLat"><h2>Menu<br />Lateral</h2></div><div id="conteudo"><h1>Conteúdo da página</h1></div><div id="rodape"><h2>Rodapé</h2></div></div></body></html>
padroes.css
body{ text-align: center;}#tudo{ width: 750px; margin: 0 auto; padding: 0; border: solid 2px red;}#topo{ position: relative; top: 0; left: 0; width: 750px; height: 110px; margin: 0; padding: 0; border: solid 2px blue;}#menuLat{ position: relative; top: 10px; left: 0; width: 170px; height: 350px; margin: 0; padding: 0; border: solid 2px yellow;}#conteudo{ position: relative; top: -340px; left: 180px; width: 560px; height: 500px; margin: 0; padding: 0; border: solid 2px green;}#rodape{ position: relative; bottom: 100%; width: 700px; width: 700px; margin: 0; padding: 0; border: solid 2px black;}
Gostaria que ficasse como nesta imagem:
[http://img405.imageshack.us/my.php?image=padroesmp7.jpg
Creio que o problema esteja aqui:
>
#conteudo{
position: relative;
**top: -340px;**O navegador não ignora o espaço que seria ocupado pela div conteúdo se ela não tivesse o top negativo.
Como posso solucionar isso?
Valeu
[]'s
Carregando comentários...