Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Olá, galera meu site estava todo alinhado qdo o fundo era cor solida ele ficava todo centralizado, agora que coloquei uma imagem de fundo todo o layout ficou alinhado a esquerda, o que devo fazer pra ficar centralizado?
O codigo é esse:
/* Main Layout
------------------------------ */
body {
width: 770px;
background-image:url(../bg.jpg);
background-repeat: repeat;
background-position: center center;
}
a:link {text-decoration: none}
a:visited {text-decoration: none}
a:hover {text-decoration: underline;
color: #FF0000;
}#menutopo {
width: 770px;
height: 53px;
float:left;
}
#menuroda {
width: 770px;
height: 53px;
/*background-position: top left;*/
float:left;
/*position:absolute;
/*left: 12%;
top: 181%; /* ALINHAMENTO DO CORPO DO SISTEMA COM O TOPO DA PAGINA QTO MAIOR O NUMERO MAIS DISTANTE */
}
#menurodaalbum {
width: 770px;
height: 53px;
background-position: top left;
float:left;
/*position:absolute;
left: 12%;
top: 110%; /* ALINHAMENTO DO CORPO DO SISTEMA COM O TOPO DA PAGINA QTO MAIOR O NUMERO MAIS DISTANTE */
}
#menurodagaleria {
width: 770px;
height: 53px;
background-position: top left;
float:left;
/*position:absolute;
left: 12%;
top: 110%; /* ALINHAMENTO DO CORPO DO SISTEMA COM O TOPO DA PAGINA QTO MAIOR O NUMERO MAIS DISTANTE */
}
#menufla {
width: 770px;
height: 347px;
float:left;
left: 12%;
/*top: 8%;*/
}
#tiraport {
background-image:url(../tira_portifolioo.jpg);
width: 770px;
height: 30px;
float:left;
}
#bordaarredondada{
background-image:url(../borda_redonda_baixo.jpg);
width: 770px;
height: 22px;
float:left;
/*position:absolute;
left: 12%;
top: 171%; /* ALINHAMENTO DO CORPO DO SISTEMA COM O TOPO DA PAGINA QTO MAIOR O NUMERO MAIS DISTANTE */
}
#bordaarredondadaalbum{
background-image:url(../borda_redonda_baixo.jpg);
width: 770px;
height: 22px;
float:left;
/*position:absolute;
left: 12%;
top: 104%; /* ALINHAMENTO DO CORPO DO SISTEMA COM O TOPO DA PAGINA QTO MAIOR O NUMERO MAIS DISTANTE */
}
#bordaarredondadagaleria{
background-image:url(../borda_redonda_baixo.jpg);
width: 770px;
height: 22px;
float:left;
}
#maingaleria {
float:left;
text-align: left;
/*position:absolute;
left: 12%;
top: 69%; /* ALINHAMENTO DO CORPO DO SISTEMA COM O TOPO DA PAGINA QTO MAIOR O NUMERO MAIS DISTANTE */
width: 708px;
background: #fff;
padding: 150px 30px 0px;
border-top: 0px solid #E6E6DF;
border-right: 1px solid #E6E6DF;
border-bottom: 0px solid #E6E6DF;
border-left: 1px solid #E6E6DF;
}
#main {
float:left;
text-align: left;
/*position:absolute;
left: 12%;
/*top: 67%; /* ALINHAMENTO DO CORPO DO SISTEMA COM O TOPO DA PAGINA QTO MAIOR O NUMERO MAIS DISTANTE */
width: 708px;
background: #fff;
padding: 60px 30px 0px;
border-top: 0px solid #E6E6DF;
border-right: 1px solid #E6E6DF;
border-bottom: 0px solid #E6E6DF;
border-left: 1px solid #E6E6DF;
}
#credit, #sort {
width: 640px;
font-size: 100%;
color: #333333;
float:left;
text-align: left;
/*position:absolute;
/*left: 9%;
top: 173%; /* ALINHAMENTO DO CORPO DO SISTEMA COM O TOPO DA PAGINA QTO MAIOR O NUMERO MAIS DISTANTE */
font:Geneva, Arial, Helvetica, sans-serif;
} width: 640px;
font-size: 100%;
color: #000000;
text-align: right;
float:left;
/*left: 9%;
position:absolute;
top: 102%; /* ALINHAMENTO DO CORPO DO SISTEMA COM O TOPO DA PAGINA QTO MAIOR O NUMERO MAIS DISTANTE */
font:Geneva, Arial, Helvetica, sans-serif;
} width: 640px;
font-size: 100%;
color: #000000;
text-align: right;
float:left;
/*left: 9%;
position:absolute;
top: 102%; /* ALINHAMENTO DO CORPO DO SISTEMA COM O TOPO DA PAGINA QTO MAIOR O NUMERO MAIS DISTANTE */
font:Geneva, Arial, Helvetica, sans-serif;
} text-decoration: none;
color: #000000;
border-bottom: 1px dotted #000000;
size: 2px;
font:Geneva, Arial, Helvetica, sans-serif;
} color: #000000;
border-bottom: 1px solid #000000;
text-decoration: none;
size: 2px;
font:Geneva, Arial, Helvetica, sans-serif;
}
#gallerytitle {
/*background-image:url(../tira_portifolio.jpg);
width: 734px;
height: 30px;
position:absolute;
top: 0%;*/
border-bottom: 1px solid #E6E6DF;
/*padding-bottom: 14px;
margin-bottom: 20px;
/*min-height: 40px;
_height: 40px;*/
} font-weight: normal;
font-size: 12pt;
margin-top: 18px;
width:510px;
}
Obrigado, pela atenção.
Thiago me ajuda + um pouquinho, rsrsrs...sou leigo nesse negocio, o fiz o seguinte tirei do body o width mas o layout ficou do msm jeito..., desde já obrigado pela atenção, na maioria das divs usei o float:left será que pode ser por causa disso?
Thiago...fiz uns testes aqui e deixei uma div assim:
#menutopo {
width: 770px;
height: 53px;
position: absolute;
left: 10%;
top: 2%;
}
dessa forma eu consigo movimenta o menu pra onde eu querer, mas essa forma seria a mais correta pra deixar tudo centralizado?Crie uma div que engloba todo a sua página, ou seja, todas as div. Defina um id="tudo", por exemplo. No CSS faça assim:
body {
background-image:url(../bg.jpg);
background-repeat: repeat;
background-position: center center;
}width: 770px;
margin: 0 auto;
}Thiago show de bola, deu certo muito obrigado pela atenção e é muito bom acessar um forum onde por trás dele tem profissionais qualificados, sucesso pra ti.
Opa, que bom que te ajudou. ^_^
http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
Não defina width para o body. Faça isso na div que engloba todo o site.
http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif