Centralizando Site
Galera estou com um problema de centralizar o site
eu coloquei na div geral o margin: auto; padding: auto;
mais como o meu rodape e daqueles fixo sempre no final do site..
ele desentralizou..
vou coloca o codigo xhtml e o CSS para vocês analizarem e me ajudar a centralizar o site.
xhtml:
<!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">](http://www.w3.org/1999/xhtml)
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="style.css" media="screen" rel="stylesheet" />
<title>Faculdade Católica no Dragão Fashion 2010</title>
<STYLE TYPE="text/css"><!-- / $WEFT -- Created by: Luciano Oliveira (Unknown) on 19/04/2010 -- /
@font-face {
font-family: Grover;
font-style: normal;
font-weight: normal;
src: url(GROVER0.eot);
}-->
</STYLE>
</head>
<body>
<div id="fundoCabecalho"></div>
<div id="global">
<div id="cabecalho"> </div>
<div id="menu">
<ul class="menu01">
<li><a href="#">Inicio</a>-</li>
<li><a href="#">Cursos</a>-</li>
<li><a href="#">Programação</a>-</li>
<li><a href="#">Galeria de Fotos</a>-</li>
<li><a href="#">Fale Conosco</a></li>
</ul>
<div style="clear:both"></div>
</div><!-- Começo do Conteudo -->
<div id="conteudo">
<h3>O que está acontecendo</h3>
<img src="img/linha.jpg" width="800" height="12" border="0" class="linha" />
<img src="img/img02.jpg" width="155" height="121" border="0" class="img" />
<div class="texto">
<h3>Titulo da Noticia</h3>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages.</p>
<h3 class="h3">Leia Mais</h3>
</div>
<div style="clear:both"></div>
<div class="linkTodos"><h3>Veja todas as novidades</h3></div>
</div><!-- Começo do Conteudo -->
<div id="rodape"> </div>
</div>
</body>
</html>CSS:
@charset "utf-8";
/ CSS Document /
@font-face {
font-family: Grover;
font-style: normal;
font-weight: normal;
src: url(GROVER0.eot);
}html, body {height:100%;}
body{
margin:0;
padding:0;
background:#FFFFFF;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
}li{
list-style:none;
}
#global{
width:100%;position:relative; /Contexto de posicionamento /
min-height:100%;/**/
}
* html #global {height: 100%;}
#fundoCabecalho{
width:100%;
height:277px;
background:url(img/img.jpg) repeat-x center;
position:absolute;
z-index:-1000;
}
#cabecalho{
width:100%;
height:209px;
background:url(img/topo.jpg) no-repeat left;
}
#menu{
margin-top:40px;
}#menu .menu01 li{
float:left;
}#menu .menu01 li a{
text-decoration:none;
color:#FFFFFF;
font-size:13px;
padding:11px 10px 10px 10px;
}#menu .menu01 li a:hover{
background:#006699;
text-decoration:underline;
}
#conteudo{
width:800px;
padding-bottom:120px;
margin-top:20px;
}#conteudo h3{
font-family:Grover;
margin-left:10px;
color:#999999;
}#conteudo .linha{
margin-left:10px;
margin-top:-10px;
}#conteudo .img{
margin-left:15px;
border:3px solid #CCCCCC;
margin-top:5px;float:left;}
#conteudo .texto{
margin-top:-10px;
margin-left:170px;
width:623px;
}#conteudo .texto h3{
color:#333333;
letter-spacing:-1px;
}#conteudo .texto .h3{
color:#333333;
letter-spacing:-1px;
font-size:12px;
margin-top:-10px;
}#conteudo .texto p{
color:#666666;
font-size:12px;
font-family:Arial, Helvetica, sans-serif;
margin-left:10px;
margin-top:-13px;
}#conteudo .linkTodos{
margin-top:30px;
}#conteudo .linkTodos h3{
text-align:center;
color:#333333;
letter-spacing:-1px;
}
#rodape{
background:url(img/backgroundrodape.jpg) repeat-x;
height:128px;
position: absolute;
bottom: 0;
width:100%;
}alguém pode me ajudar a centralizar esse site?
de acordo com a resolução
Discussão (7)
Carregando comentários...