Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Olá pessoal,
Eu estou com um problema de Posicionamento de imagens, na resolução que eu uso (1280 x 1024) o Menu e o Banner ficam centralizado, mas só que em 1024 x 768 não ficam, para entenderem melhor, segue a imagem dele em 1024 x 768:
Queria que o Banner e o Menu ficasse no centralizado e também queria que não tivesse aquele "espaçinho em branco" antes da linha (ver a flecha verde)
Meu index.html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="[http://www.w3.org/1999/xhtml">](http://www.w3.org/1999/xhtml)
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Novo Site</title>
<link href="estilo2.css" rel="stylesheet" type="text/css" />
<script src="maxheight.js" type="text/javascript"></script>
</head>
<body onload="new ElementMaxHeight();">
<div id="topo">
<div id="main">
<div id="header">
<br/>
<div id="menu">
<div class="direitobg">
<div class="esquerdobg">
<div class="padding">
<ul>
<li><span>Início</span></li>
<li><a href="index-1.html">Sobre mim</a></li>
<li><a href="index-2.html">Serviços</a></li>
<li><a href="index-3.html">Portifólio</a></li>
<li><a href="index-4.html">Contato</a></li>
<li><a href="index-5.html">Fórum</a></li>
</ul>
<br class="clear" />
</div>
</div>
</div>
</div>
<div class="banner">
<div class="clear"></div>
</div>
<div id="quadros">
<div class="direitobg">
<div class="esquerdobg2">
<div class="padding2">
Teste TESTES TESTES TESTES TESTES TESTES TESTES TESTES TESTES TESTES TESTES TESTES TESTES TESTES
</div>
</div>
</div>
</div>
<div class="clear"></div>
<div class="texto_principal">
Teste
</div>
<br/>
<div class="p1">
Teste.
</div>
<br/>
<!--começo do rodapé -->
<div id="rodape">
Testes - 2008 © • Direitos Reservados
</div>
<!--fim do rodapé-->
</div>
</div>
</div>
</body> Meu **estilo2.css**:html
{
font-family:Times New Roman, tahoma;
font-size:13px;
line-height:15px;
color:#868686;
}img {vertical-align:top;}
.clear { clear:both;}
#main { margin:0 auto;}
#header
{
height: 45px;
width: 100%;
background-image: url(header.jpg);
background-repeat: no-repeat;
background-position: 0 0;
border-bottom: 1px solid #fff;
position: relative;
border: 1px none #fff;
border-bottom: 1px solid #fff;
}#topo {background:url(images/header_tall.gif) top repeat-x;}
#menu
{
max-width: 780px;
background:url(images/menu_tall.gif) top repeat-x;
margin:10px 0 12px 250px;
}.banner {background:url(images/banner.gif) top left no-repeat; padding:45px 300px 100px 414px; color:#ffffff; margin:10px 0 12px 250px;}
#quadros
{
max-width: 200px;
background:url(images/menu_tall.gif) top repeat-x;
margin:10px 0 12px 250px;
}.texto_principal {text-align: center; color: #3d6f92; font-size: 18px;}
.p1 {padding:1px 250px 7px 250px;}
#rodape {background:url(images/header_tall.gif) top repeat-x; padding:23px 0 0 250px; color:#868686; font-size:12px;}
Estou aprendendo CSS, sou muito leigo ainda, quem puder me ajudar.
Agradeço desde já.
Até mais! http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
Carregando comentários...