Ir para conteúdo

POWERED BY:

Arquivado

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

rcdesign

Não consigo centralizar horizontalmente

Recommended Posts

Não estou conseguindo centralizar o topo do meu site.... já tentei um monte de coisas e não dá certo....

Meu layout, bem como meu código, está programado para utilizar 100% da área do browser, mas o topo, que contém várias imagens e a barra de navegação fica sempre alinhada a esquerda..

 

meu topo é assim:

 

<div id="topo">  <div class="topologo"> </div>  <div class="toposup"> </div>  <div class="menu"><? include "menutop.php" ?></div>  <div class="topoinf"> </div></div>
e o css..

 

#topo{	width:100%;	height:82px;	background-image:url(img/topofundo2.jpg);	text-align:center;}.topologo	{	background: url(img/topologo.jpg);	width: 213px;	height:82px;	position:relative;	float: left;}.toposup	{	background: url(img/toposup.jpg);	width: 538px;	height:35px;	position:relative;	float: left;	}.menu	{	background: url(img/toposlice.jpg);	width: 538px;	height:30px;	position:relative;	float: left;	}.topoinf	{	background: url(img/topoinf.jpg);	width: 538px;	height:17px;	position:relative;	float: left;	}

Alguém consegue me ajudar?

Compartilhar este post


Link para o post
Compartilhar em outros sites

pra cada caixa <div> dentro da <div id="topo">, crie a seguinte propriedade:

 

margin: 0 auto;

 

Esta é a forma correta de centralizar um objeto "bloco" na página. No IE, um text-align:center; na tag pai resolve, mas é errado segundo os padrões da W3C... beleza? ;)

Compartilhar este post


Link para o post
Compartilhar em outros sites

Valeu pela dica e orientação Illidan, mas não resolveu exatamente, porquê a estrutura do topo é a seguinte:topologo - imagem à esquerda das outras divs..toposup - imagem à direita do topologo e acima da div menumenu - imagem de fundo para a barra de navegação, à direita do topologo e abaixo da div toposuptopoinf - imagem abaixo de todas as outras...se eu coloco a posição relativa nas divs as imagens ficam posicionadas corretamente mas todas alinhadas à esquerda.colocando a informação "margin: 0 auto;", fica tudo centralizado, mas uma imagem embaixo da outra, perdendo o layout.

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.