Centralizar código, botões menu

Qual é minha questão:
Bom pessoal esse código deixa os botões assim: https://i.servimg.com/u/f55/18/70/08/92/118.png
porem usei um photo shop para mostrar como quero, e é esse o resultado: https://i.servimg.com/u/f55/18/70/08/92/216.png

Código:

#pun-navlinks li a {
  margin: 0 !important;
}
#pun-navlinks a {
  background: none repeat scroll 0 0 #333333;
  color: #CBCBCB;
  display: block;
  line-height: 1em;
  padding: 0 20px;
  text-decoration: none;
}
#pun-navlinks > ul > li > a {
     line-height: 48px;
}
#pun-navlinks ul li.active > a, #pun-navlinks ul li:hover > a {
     background: none repeat scroll 0px 0px #F55F5F;
     color: #FFFFFF;
}
#pun-head #pun-navlinks ul li {
  float: left;
  height: 48px;
  min-height: 1px;
  vertical-align: middle;
}
#pun-head #pun-navlinks ul {
     position: relative;
     text-transform: uppercase;
     z-index: 597;
}
#pun-head #pun-navlinks {
  -moz-border-bottom-colors: none;
  -moz-border-left-colors: none;
  -moz-border-right-colors: none;
  -moz-border-top-colors: none;
  background: none repeat scroll 0 0 #333333 !important;
  border-color: -moz-use-text-color -moz-use-text-color #F55F5F !important;
  border-image: none;
  border-style: none none solid !important;
  border-width: 0 0 4px !important;
  font-family: 'Oxygen Mono',Tahoma,Trebuchet MS,sans-serif !important;
  font-size: 12px !important;
  margin: 0 0 0 -5px !important;
  padding: 0 !important;
  width: 101%;
}

Endereço do meu fórum:
http://legendofseiya.forumeiros.com/

Versão do fórum:
PHPBB

Olá,

Poderia postar o link do seu fórum, por favor?

Obs: Vá em seu Painel de controle -> Visualização -> Cabeçalho & Navegação certifique-se de que a seguinte pergunta: Posição do menu : - > Esteja marcada em Centralizar.

Cordiais Saudações;
Alex!

bom amigo, esta marcada porem não funcionou, e meu fórum é : http://legendofseiya.forumeiros.com/

Olá, Boa tarde amigo!

Adicione em sua folha CSS e veja se resolva:

Código:


.clearfix {
margin-left: 180px;
}


Cordiais Saudações;
Alex!

não funcionou, como eu disse, tem que modificar algo dentro do código '-'

Olá,

Eu pesquisei o seu código e acho que encontrei rs,

Procure em sua folha CSS este código:

Código:


#pun-navlinks a {
    background: none repeat scroll 0 0 #333333;
    color: #CBCBCB;
    display: block;
    line-height: 1em;
    padding: 0 20px;
    text-decoration: none;
}


Troque por este:

Código:


#pun-navlinks a {
    background: none repeat scroll 0 0 #333333;
    color: #CBCBCB;
    display: block;
    line-height: 1em;
    padding: 0 50px;
    text-decoration: none;
}


Explicação
Para o senhor alterar como deseja, o valor em padding será onde iremos modificar para alterar o menu.

Cordiais Saudações;
Alex!

Olá!

Usei este CSS:

Código:

div#pun-head #pun-navlinks ul.clearfix {
padding-left: 20% !important;
padding-right: 20% !important;
}

Resultado: http://prntscr.com/2nr34n

Confirma?

Hancki