Reset disturbing to centralize

0

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;
}
    
asked by anonymous 14.04.2016 / 01:20

2 answers

0

One possible solution is to get the margin: 0 auto; from the .menuNav element and on its ul .menuUlTopo add margin: 0 auto; and width: 1030px;

    
14.04.2016 / 01:39
0

I did it.

.menuNav {
      margin: auto;
      width:1007px;
      background-color:#3E4095; 
}
    
14.04.2016 / 02:47