I have a problem and a bit of shame in asking for help.
Today I still had a similar problem in: Error centering ul on div
However, I solved only by doing margin:auto
in div
and centering ul.
Now the problem is the reverse. is margin: auto
is who is not allowing the nav
.
I've been eliminating almost everything in my code until I get to that piece of code.
What do I do?
HTML
<nav class="menuNav">
<ul class="menuUlTopo">
<li class="menuTopo"><a href="principal.php" title="Principal">Principal</a></li>
<li class="menuTopo"><a href="administradoresMenu.php" title="Administradores">Administradores</a></li>
<li class="menuTopo"><a href="clientesMenu.php" title="Clientes">Clientes</a></li>
<li class="menuTopo"><a href="imoveisMenu.php" title="Imóveis">Imóveis</a></li>
<li class="menuTopo"><a href="tiposMenu.php" title="Tipos de Imóveis">Tipos de Imóveis</a></li>
<li class="menuTopo"><a href="emails.php?acao=listar" title="E-mails">E-mails</a></li>
</ul>
</nav>
CSS
* {
padding:0 auto;
margin:0 auto;
font-family: Arial;
}
body {
color: #CCC;
}
ul {
list-style-type:none;
padding:0;
}
a, a:hover {
text-decoration:none;
color:#FFF;
}
.menuNav {
height:50px;
margin: 0 auto;
background-color:#3E4095;
}
ul li.menuTopo {
float:left;
width:166.6px;
height:50px;
border-left: #005E9C 1px solid;
}
ul li.menuTopo:last-child {
border-right: #005E9C 1px solid;
}
ul li.menuTopo a {
width:166.6px;
height:50px;
line-height:50px;
display:inline-block;
vertical-align:middle;
text-align:center;
color: #FFF;
background-color:#3E4095;
}
ul li.menuTopo a:hover, ul li.menuBase a:hover {
color: #FFF;
background-color:#CCC;
}