Boa tarde galera, sou novato aqui. Então, faz algum tempo que estou tendo problemas em centralizar o menu do meu blog, gostaria de pedir a ajuda de vocês...
Segue o codigo:
<!-- Start - Navigation
-->
<div class='nav'>
<ul class='menu' id='menu'>
<li><a expr:href='data:blog.homepageUrl'>home</a></li>
<li><a href='http://edgargd.blogspot.com.br/p/about.html'>Sobre</a></li>
<li><a href='http://edgargd.blogspot.com.br/p/servicos.html'>Serviços</a></li>
<li><a class='drop-ctg' href='#'>Galeria</a>
<ul>
<li><a href='http://edgargd.blogspot.com.br/search/label/masculino?max-results=6'>Masculinos</a></li>
<li><a href='http://edgargd.blogspot.com.br/search/label/feminino?max-results=6'>Femininos </a></li>
<li><a href='http://edgargd.blogspot.com.br/search/label/Casais?max-results=6'>Casamentos</a></li>
</ul>
</li>
<li><a href='http://edgargd.blogspot.com.br/p/contato_03.html'>Contato</a></li>
</ul>
</div>
<!-- End - Navigation Menu -->
CSS
/* =============================
Navigation
============================= */
*{
margin:0;
padding:0;
outline:0;
}
.nav {
width:940px;
height:0 auto;
border-bottom:1px solid #eee;
margin:10px auto 5px;
display:inline-block;
}
.menu {
width:auto;
list-style:none;
font:$lisnavifont;
text-align:center;
margin:0 auto;
}
.menu a {
position:relative;
float:center;
color:#999;
text-decoration:none;
text-transform:uppercase;
width:auto;
line-height:36px;
padding:0 60px;
}
.menu a:hover,li.menuhover a{
color:#111;
}
.menu li {
position:relative;
float:left;
width:auto;
}
.menu li:last-child {
background:none;
}
.menu ul{
display:none;
position:absolute;
top:36px;
left:0
;
background:#fbfbfb;
display:none;
list-style:none;
}
.menu ul li{
float:none;
border-top:1px solid #e3e3e3;
border-right:1px solid #e3e3e3;
border-left:1px solid #e3e3e3;
width:auto;
background:none;
}
.menu ul li:last-child {
border-bottom:1px solid #e3e3e3
}
.menu ul li a{
float:none;
display:block;
background:none;
line-height:36px;
min-width:137px;
width:auto;
text-align:center;
padding-left:10px;
color:#444;
}
.menu ul li a:hover{
background:#fdfdfd;
color:#777;
}
/* =============================
Wrapper
============================= */
#total-wrapper {
margin: 0 auto;
padding 0 10px;
background:#fff;
width:1000px;
}
#outer-wrapper{
width:940px;
margin:0;
padding:5px 20px 0;
text-align:$startSide;
font:$bodyfont;
}
#main-wrapper {
width:680px;
float:$endSide;
word-wrap:break-word;
overflow:hidden;
}
#sidebar-wrapper{
width:240px;
float:$startSide;
word-wrap:break-word;
overflow:hidden;
}