Css menu maker grudado

Qual é minha questão:
Eu estava tendo alguns erros no meu menu personalizado então fiz um pedido de ajuda nesse tutorial https://ajuda.forumeiros.com/t82646-adicionar-css-menu-maker#564652 o erro anterior saiu , mas veio outro , e eu pensei que poderia arrumar sozinho mas não consegui  então gostaria de ajuda .
 
Erro: as palavras do menu estão todas grudadas como mostro nessa captura de tela : https://i.servimg.com/u/f36/18/38/47/89/ssssss10.png

Códigos Usados:

JS :

Código:

jQuery(document).ready(function(){
jQuery("#page-header .navbar, body table.bodylinewidth tbody tr td.bodyline table tbody tr td a:eq(0), #pun-head #pun-navlinks, #submenu").before("<div class='novomenu'></div>");
jQuery("#page-header .navbar, body table.bodylinewidth tbody tr td.bodyline table tbody tr td a:eq(0), #pun-head #pun-navlinks, #submenu").css({"display":"none"});});
jQuery(document).ready(function(){if(jQuery('#logout').length){var m="        <div id='cssmenu'>
        <ul>
          <li><a href='/forum'><span>Início</span></a></li>
          <li><a href='/faq'><span>Faq</span></a></li>
          <li><a href='/search'><span>Buscar</span></a></li>
          <li><a href='/memberlist'><span>Membros</span></a></li>
          <li><a href='/groups'><span>Grupos</span></a></li>
          <li><a href='/profile?mode=editprofile'><span>Perfil</span></a></li>
          <li><a href='/privmsg?folder=inbox'><span>MP</span></a></li>
          <li class='last'><a href='/login?logout=1&tid=cd0e30bc93911d1542a9cd6d9e6cda04&key=a73675'><span>Sair</span></a></li>
        </ul>
        </div>"}else{var m="        <div id='cssmenu'>
        <ul>
          <li><a href='/forum'><span>Início</span></a></li>
          <li><a href='/faq'><span>Faq</span></a></li>
          <li><a href='/search'><span>Buscar</span></a></li>
          <li><a href='/memberlist'><span>Membros</span></a></li>
          <li><a href='/groups'><span>Grupos</span></a></li>
          <li class='last'><a href='/login'><span>Entrar</span></a></li>
        </ul>
        </div>"};jQuery('.novomenu').replaceWith(m)});

CSS

Código:

#cssmenu a {
background-color: black !important;
}
.mainmenu {
display: none;
}
#cssmenu ul,
#cssmenu li,
#cssmenu span,
#cssmenu a {
 margin: 0;
 padding: 0;
 position: relative;
}
#cssmenu {
 height: 49px;
 border-radius: 5px 5px 0 0;
 -moz-border-radius: 5px 5px 0 0;
 -webkit-border-radius: 5px 5px 0 0;
 background: #141414;
 background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAxCAIAAACUDVRzAAAAA3NCSVQICAjb4U/gAAAALElEQVQImWMwMrJi+v//PxMDw3+m//8ZoPR/qBgDEhuXGLoeYswhXg8R5gAAdVpfoJ3dB5oAAAAASUVORK5CYII=) 100% 100%;
 background: -moz-linear-gradient(top, #32323a 0%, #141414 100%);
 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #32323a), color-stop(100%, #141414));
 background: -webkit-linear-gradient(top, #32323a 0%, #141414 100%);
 background: -o-linear-gradient(top, #32323a 0%, #141414 100%);
 background: -ms-linear-gradient(top, #32323a 0%, #141414 100%);
 background: linear-gradient(to bottom, #32323a 0%, #141414 100%);
 border-bottom: 2px solid #0FA1E0;
}
#cssmenu:after,
#cssmenu ul:after {
 content: '';
 display: block;
 clear: both;
}
#cssmenu a {
 background: #141414;
 background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAxCAIAAACUDVRzAAAAA3NCSVQICAjb4U/gAAAALElEQVQImWMwMrJi+v//PxMDw3+m//8ZoPR/qBgDEhuXGLoeYswhXg8R5gAAdVpfoJ3dB5oAAAAASUVORK5CYII=) 100% 100%;
 background: -moz-linear-gradient(top, #32323a 0%, #141414 100%);
 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #32323a), color-stop(100%, #141414));
 background: -webkit-linear-gradient(top, #32323a 0%, #141414 100%);
 background: -o-linear-gradient(top, #32323a 0%, #141414 100%);
 background: -ms-linear-gradient(top, #32323a 0%, #141414 100%);
 background: linear-gradient(to bottom, #32323a 0%, #141414 100%);
 color: #ffffff;
 display: inline-block;
 font-family: Helvetica, Arial, Verdana, sans-serif;
 font-size: 12px;
 line-height: 49px;
 padding: 0 20px;
 text-decoration: none;
}
#cssmenu ul {
 list-style: none;
}
#cssmenu > ul {
 float: left;
}
#cssmenu > ul > li {
 float: left;
}
#cssmenu > ul > li:hover:after {
 content: '';
 display: block;
 width: 0;
 height: 0;
 position: absolute;
 left: 50%;
 bottom: 0;
 border-left: 10px solid transparent;
 border-right: 10px solid transparent;
 border-bottom: 10px solid #0fa1e0;
 margin-left: -10px;
}
#cssmenu > ul > li:first-child > a {
 border-radius: 5px 0 0 0;
 -moz-border-radius: 5px 0 0 0;
 -webkit-border-radius: 5px 0 0 0;
}
#cssmenu > ul > li:last-child > a {
 border-radius: 0 5px 0 0;
 -moz-border-radius: 0 5px 0 0;
 -webkit-border-radius: 0 5px 0 0;
}
#cssmenu > ul > li.active > a {
 box-shadow: inset 0 0 3px #000000;
 -moz-box-shadow: inset 0 0 3px #000000;
 -webkit-box-shadow: inset 0 0 3px #000000;
 background: #070707;
 background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAxCAIAAACUDVRzAAAAA3NCSVQICAjb4U/gAAAALklEQVQImWNQU9Nh+v//PxMDw3+m//8ZkNj/mRgYIHxy5f//Z0BSi18e2TwS5QG4MGB54HL+mAAAAABJRU5ErkJggg==) 100% 100%;
 background: -moz-linear-gradient(top, #26262c 0%, #070707 100%);
 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #26262c), color-stop(100%, #070707));
 background: -webkit-linear-gradient(top, #26262c 0%, #070707 100%);
 background: -o-linear-gradient(top, #26262c 0%, #070707 100%);
 background: -ms-linear-gradient(top, #26262c 0%, #070707 100%);
 background: linear-gradient(to bottom, #26262c 0%, #070707 100%);
}
#cssmenu > ul > li:hover > a {
 background: #070707;
 background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAxCAIAAACUDVRzAAAAA3NCSVQICAjb4U/gAAAALklEQVQImWNQU9Nh+v//PxMDw3+m//8ZkNj/mRgYIHxy5f//Z0BSi18e2TwS5QG4MGB54HL+mAAAAABJRU5ErkJggg==) 100% 100%;
 background: -moz-linear-gradient(top, #26262c 0%, #070707 100%);
 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #26262c), color-stop(100%, #070707));
 background: -webkit-linear-gradient(top, #26262c 0%, #070707 100%);
 background: -o-linear-gradient(top, #26262c 0%, #070707 100%);
 background: -ms-linear-gradient(top, #26262c 0%, #070707 100%);
 background: linear-gradient(to bottom, #26262c 0%, #070707 100%);
 box-shadow: inset 0 0 3px #000000;
 -moz-box-shadow: inset 0 0 3px #000000;
 -webkit-box-shadow: inset 0 0 3px #000000;
}
#cssmenu .has-sub {
 z-index: 1;
}
#cssmenu .has-sub:hover > ul {
 display: block;
}
#cssmenu .has-sub ul {
 display: none;
 position: absolute;
 width: 200px;
 top: 100%;
 left: 0;
}
#cssmenu .has-sub ul li {
 *margin-bottom: -1px;
}
#cssmenu .has-sub ul li a {
 background: #0fa1e0;
 border-bottom: 1px dotted #6fc7ec;
 filter: none;
 font-size: 11px;
 display: block;
 line-height: 120%;
 padding: 10px;
}
#cssmenu .has-sub ul li:hover a {
 background: #0c7fb0;
}
#cssmenu .has-sub .has-sub:hover > ul {
 display: block;
}
#cssmenu .has-sub .has-sub ul {
 display: none;
 position: absolute;
 left: 100%;
 top: 0;
}
#cssmenu .has-sub .has-sub ul li a {
 background: #0c7fb0;
 border-bottom: 1px dotted #B82C00;
}
#cssmenu .has-sub .has-sub ul li a:hover {
 background: #095c80;
}

Endereço do meu fórum:
http://rato-de-forum.forumeiros.com

Versão do fórum:
PHPBB2

Olá!

Troque teu CSS pelo abaixo:

Código:

#cssmenu a {
background-color: black !important;
}
#cssmenu a, #cssmenu li, #cssmenu span, #cssmenu ul {
margin: 0;
padding: 1 !important;
position: relative;
}
.mainmenu {
display: none;
}
#cssmenu ul,
#cssmenu li,
#cssmenu span,
#cssmenu a {
 margin: 0;
 padding: 0;
 position: relative;
}
#cssmenu {
 height: 49px;
 border-radius: 5px 5px 0 0;
 -moz-border-radius: 5px 5px 0 0;
 -webkit-border-radius: 5px 5px 0 0;
 background: #141414;
 background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAxCAIAAACUDVRzAAAAA3NCSVQICAjb4U/gAAAALElEQVQImWMwMrJi+v//PxMDw3+m//8ZoPR/qBgDEhuXGLoeYswhXg8R5gAAdVpfoJ3dB5oAAAAASUVORK5CYII=) 100% 100%;
 background: -moz-linear-gradient(top, #32323a 0%, #141414 100%);
 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #32323a), color-stop(100%, #141414));
 background: -webkit-linear-gradient(top, #32323a 0%, #141414 100%);
 background: -o-linear-gradient(top, #32323a 0%, #141414 100%);
 background: -ms-linear-gradient(top, #32323a 0%, #141414 100%);
 background: linear-gradient(to bottom, #32323a 0%, #141414 100%);
 border-bottom: 2px solid #0FA1E0;
}
#cssmenu:after,
#cssmenu ul:after {
 content: '';
 display: block;
 clear: both;
}
#cssmenu a {
 background: #141414;
 background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAxCAIAAACUDVRzAAAAA3NCSVQICAjb4U/gAAAALElEQVQImWMwMrJi+v//PxMDw3+m//8ZoPR/qBgDEhuXGLoeYswhXg8R5gAAdVpfoJ3dB5oAAAAASUVORK5CYII=) 100% 100%;
 background: -moz-linear-gradient(top, #32323a 0%, #141414 100%);
 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #32323a), color-stop(100%, #141414));
 background: -webkit-linear-gradient(top, #32323a 0%, #141414 100%);
 background: -o-linear-gradient(top, #32323a 0%, #141414 100%);
 background: -ms-linear-gradient(top, #32323a 0%, #141414 100%);
 background: linear-gradient(to bottom, #32323a 0%, #141414 100%);
 color: #ffffff;
 display: inline-block;
 font-family: Helvetica, Arial, Verdana, sans-serif;
 font-size: 12px;
 line-height: 49px;
 padding: 0 20px;
 text-decoration: none;
}
#cssmenu ul {
 list-style: none;
}
#cssmenu > ul {
 float: left;
}
#cssmenu > ul > li {
 float: left;
}
#cssmenu > ul > li:hover:after {
 content: '';
 display: block;
 width: 0;
 height: 0;
 position: absolute;
 left: 50%;
 bottom: 0;
 border-left: 10px solid transparent;
 border-right: 10px solid transparent;
 border-bottom: 10px solid #0fa1e0;
 margin-left: -10px;
}
#cssmenu > ul > li:first-child > a {
 border-radius: 5px 0 0 0;
 -moz-border-radius: 5px 0 0 0;
 -webkit-border-radius: 5px 0 0 0;
}
#cssmenu > ul > li:last-child > a {
 border-radius: 0 5px 0 0;
 -moz-border-radius: 0 5px 0 0;
 -webkit-border-radius: 0 5px 0 0;
}
#cssmenu > ul > li.active > a {
 box-shadow: inset 0 0 3px #000000;
 -moz-box-shadow: inset 0 0 3px #000000;
 -webkit-box-shadow: inset 0 0 3px #000000;
 background: #070707;
 background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAxCAIAAACUDVRzAAAAA3NCSVQICAjb4U/gAAAALklEQVQImWNQU9Nh+v//PxMDw3+m//8ZkNj/mRgYIHxy5f//Z0BSi18e2TwS5QG4MGB54HL+mAAAAABJRU5ErkJggg==) 100% 100%;
 background: -moz-linear-gradient(top, #26262c 0%, #070707 100%);
 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #26262c), color-stop(100%, #070707));
 background: -webkit-linear-gradient(top, #26262c 0%, #070707 100%);
 background: -o-linear-gradient(top, #26262c 0%, #070707 100%);
 background: -ms-linear-gradient(top, #26262c 0%, #070707 100%);
 background: linear-gradient(to bottom, #26262c 0%, #070707 100%);
}
#cssmenu > ul > li:hover > a {
 background: #070707;
 background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAxCAIAAACUDVRzAAAAA3NCSVQICAjb4U/gAAAALklEQVQImWNQU9Nh+v//PxMDw3+m//8ZkNj/mRgYIHxy5f//Z0BSi18e2TwS5QG4MGB54HL+mAAAAABJRU5ErkJggg==) 100% 100%;
 background: -moz-linear-gradient(top, #26262c 0%, #070707 100%);
 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #26262c), color-stop(100%, #070707));
 background: -webkit-linear-gradient(top, #26262c 0%, #070707 100%);
 background: -o-linear-gradient(top, #26262c 0%, #070707 100%);
 background: -ms-linear-gradient(top, #26262c 0%, #070707 100%);
 background: linear-gradient(to bottom, #26262c 0%, #070707 100%);
 box-shadow: inset 0 0 3px #000000;
 -moz-box-shadow: inset 0 0 3px #000000;
 -webkit-box-shadow: inset 0 0 3px #000000;
}
#cssmenu .has-sub {
 z-index: 1;
}
#cssmenu .has-sub:hover > ul {
 display: block;
}
#cssmenu .has-sub ul {
 display: none;
 position: absolute;
 width: 200px;
 top: 100%;
 left: 0;
}
#cssmenu .has-sub ul li {
 *margin-bottom: -1px;
}
#cssmenu .has-sub ul li a {
 background: #0fa1e0;
 border-bottom: 1px dotted #6fc7ec;
 filter: none;
 font-size: 11px;
 display: block;
 line-height: 120%;
 padding: 10px;
}
#cssmenu .has-sub ul li:hover a {
 background: #0c7fb0;
}
#cssmenu .has-sub .has-sub:hover > ul {
 display: block;
}
#cssmenu .has-sub .has-sub ul {
 display: none;
 position: absolute;
 left: 100%;
 top: 0;
}
#cssmenu .has-sub .has-sub ul li a {
 background: #0c7fb0;
 border-bottom: 1px dotted #B82C00;
}
#cssmenu .has-sub .has-sub ul li a:hover {
 background: #095c80;
}

Até mais.

Agora deu um erro em que eles estão separados por uma transparência, poderia ver lá no meu fórum ? aqui

Olá!

troque por este o CSS:

Código:

#cssmenu a {
background-color: black !important;
}

.mainmenu {
display: none;
}

#cssmenu {
 height: 49px;
 border-radius: 5px 5px 0 0;
 -moz-border-radius: 5px 5px 0 0;
 -webkit-border-radius: 5px 5px 0 0;
 background: #141414;
 background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAxCAIAAACUDVRzAAAAA3NCSVQICAjb4U/gAAAALElEQVQImWMwMrJi+v//PxMDw3+m//8ZoPR/qBgDEhuXGLoeYswhXg8R5gAAdVpfoJ3dB5oAAAAASUVORK5CYII=) 100% 100%;
 background: -moz-linear-gradient(top, #32323a 0%, #141414 100%);
 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #32323a), color-stop(100%, #141414));
 background: -webkit-linear-gradient(top, #32323a 0%, #141414 100%);
 background: -o-linear-gradient(top, #32323a 0%, #141414 100%);
 background: -ms-linear-gradient(top, #32323a 0%, #141414 100%);
 background: linear-gradient(to bottom, #32323a 0%, #141414 100%);
 border-bottom: 2px solid #0FA1E0;
}
#cssmenu:after,
#cssmenu ul:after {
 content: '';
 display: block;
 clear: both;
}
#cssmenu a {
 background: #141414;
 background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAxCAIAAACUDVRzAAAAA3NCSVQICAjb4U/gAAAALElEQVQImWMwMrJi+v//PxMDw3+m//8ZoPR/qBgDEhuXGLoeYswhXg8R5gAAdVpfoJ3dB5oAAAAASUVORK5CYII=) 100% 100%;
 background: -moz-linear-gradient(top, #32323a 0%, #141414 100%);
 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #32323a), color-stop(100%, #141414));
 background: -webkit-linear-gradient(top, #32323a 0%, #141414 100%);
 background: -o-linear-gradient(top, #32323a 0%, #141414 100%);
 background: -ms-linear-gradient(top, #32323a 0%, #141414 100%);
 background: linear-gradient(to bottom, #32323a 0%, #141414 100%);
 color: #ffffff;
 display: inline-block;
 font-family: Helvetica, Arial, Verdana, sans-serif;
 font-size: 12px;
 line-height: 49px;
 padding: 0 20px;
 text-decoration: none;
}
#cssmenu ul {
 list-style: none;
}
#cssmenu > ul {
 float: left;
}
#cssmenu > ul > li {
 float: left;
}
#cssmenu > ul > li:hover:after {
 content: '';
 display: block;
 width: 0;
 height: 0;
 position: absolute;
 left: 50%;
 bottom: 0;
 border-left: 10px solid transparent;
 border-right: 10px solid transparent;
 border-bottom: 10px solid #0fa1e0;
 margin-left: -10px;
}
#cssmenu > ul > li:first-child > a {
 border-radius: 5px 0 0 0;
 -moz-border-radius: 5px 0 0 0;
 -webkit-border-radius: 5px 0 0 0;
}
#cssmenu > ul > li:last-child > a {
 border-radius: 0 5px 0 0;
 -moz-border-radius: 0 5px 0 0;
 -webkit-border-radius: 0 5px 0 0;
}
#cssmenu > ul > li.active > a {
 box-shadow: inset 0 0 3px #000000;
 -moz-box-shadow: inset 0 0 3px #000000;
 -webkit-box-shadow: inset 0 0 3px #000000;
 background: #070707;
 background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAxCAIAAACUDVRzAAAAA3NCSVQICAjb4U/gAAAALklEQVQImWNQU9Nh+v//PxMDw3+m//8ZkNj/mRgYIHxy5f//Z0BSi18e2TwS5QG4MGB54HL+mAAAAABJRU5ErkJggg==) 100% 100%;
 background: -moz-linear-gradient(top, #26262c 0%, #070707 100%);
 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #26262c), color-stop(100%, #070707));
 background: -webkit-linear-gradient(top, #26262c 0%, #070707 100%);
 background: -o-linear-gradient(top, #26262c 0%, #070707 100%);
 background: -ms-linear-gradient(top, #26262c 0%, #070707 100%);
 background: linear-gradient(to bottom, #26262c 0%, #070707 100%);
}
#cssmenu > ul > li:hover > a {
 background: #070707;
 background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAxCAIAAACUDVRzAAAAA3NCSVQICAjb4U/gAAAALklEQVQImWNQU9Nh+v//PxMDw3+m//8ZkNj/mRgYIHxy5f//Z0BSi18e2TwS5QG4MGB54HL+mAAAAABJRU5ErkJggg==) 100% 100%;
 background: -moz-linear-gradient(top, #26262c 0%, #070707 100%);
 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #26262c), color-stop(100%, #070707));
 background: -webkit-linear-gradient(top, #26262c 0%, #070707 100%);
 background: -o-linear-gradient(top, #26262c 0%, #070707 100%);
 background: -ms-linear-gradient(top, #26262c 0%, #070707 100%);
 background: linear-gradient(to bottom, #26262c 0%, #070707 100%);
 box-shadow: inset 0 0 3px #000000;
 -moz-box-shadow: inset 0 0 3px #000000;
 -webkit-box-shadow: inset 0 0 3px #000000;
}
#cssmenu .has-sub {
 z-index: 1;
}
#cssmenu .has-sub:hover > ul {
 display: block;
}
#cssmenu .has-sub ul {
 display: none;
 position: absolute;
 width: 200px;
 top: 100%;
 left: 0;
}
#cssmenu .has-sub ul li {
 *margin-bottom: -1px;
}
#cssmenu .has-sub ul li a {
 background: #0fa1e0;
 border-bottom: 1px dotted #6fc7ec;
 filter: none;
 font-size: 11px;
 display: block;
 line-height: 120%;
 padding: 10px;
}
#cssmenu .has-sub ul li:hover a {
 background: #0c7fb0;
}
#cssmenu .has-sub .has-sub:hover > ul {
 display: block;
}
#cssmenu .has-sub .has-sub ul {
 display: none;
 position: absolute;
 left: 100%;
 top: 0;
}
#cssmenu .has-sub .has-sub ul li a {
 background: #0c7fb0;
 border-bottom: 1px dotted #B82C00;
}
#cssmenu .has-sub .has-sub ul li a:hover {
 background: #095c80;
}

Até mais.

É o seguinte , funcionou mais ou menos ,eles se distanciaram mas a setinha azul que aparece quando passa o mouse esta aparecendo mais embaixo (junto com as categorias ) , mas eu gostaria de saber em qual parte da CSS muda a distancia para eu poder mudar manualmente quando necessario

Olá autor,

Eu não compreendi bem quando o senhor diz "embaixo (junto com as categorias )":

#cssmenu a, #cssmenu li, #cssmenu span, #cssmenu ul {
margin: 0;
padding: 0px;
position: relative;
}

Negrito, o senhor pode aumentar o espaço.

Até mais.

Sheldon eu encontrei um código que arrumou o erro anterior mas eu queria uma pequena modificação  

como está agora-->aqui
como eu quero -->aqui

Meu css do menu atual:

Código:

       #cssmenu {
        -moz-border-radius: 5px 5px 0 0;
        -webkit-border-radius: 5px 5px 0 0;
        background: #3A3A3A!important;
        border-bottom: 2px solid #0fa1e0;
        border-radius: 5px 5px 0 0;
        height: 49px;
        }
        #cssmenu ul,
        #cssmenu li,
        #cssmenu span,
        #cssmenu a {
         margin: 0;
         padding: 0;
         position: relative;
        }
        #cssmenu {
         height: 49px;
         border-radius: 5px 5px 0 0;
         -moz-border-radius: 5px 5px 0 0;
         -webkit-border-radius: 5px 5px 0 0;
         background: #141414;
         background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAxCAIAAACUDVRzAAAAA3NCSVQICAjb4U/gAAAALElEQVQImWMwMrJi+v//PxMDw3+m//8ZoPR/qBgDEhuXGLoeYswhXg8R5gAAdVpfoJ3dB5oAAAAASUVORK5CYII=) 100% 100%;
         background: -moz-linear-gradient(top, #32323a 0%, #141414 100%);
         background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #32323a), color-stop(100%, #141414));
         background: -webkit-linear-gradient(top, #32323a 0%, #141414 100%);
         background: -o-linear-gradient(top, #32323a 0%, #141414 100%);
         background: -ms-linear-gradient(top, #32323a 0%, #141414 100%);
         background: linear-gradient(to bottom, #32323a 0%, #141414 100%);
         border-bottom: 2px solid #0FA1E0;
        }
        #cssmenu:after,
        #cssmenu ul:after {
         content: '';
         display: block;
         clear: both;
        }
        #cssmenu a {
         background: #141414;
         background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAxCAIAAACUDVRzAAAAA3NCSVQICAjb4U/gAAAALElEQVQImWMwMrJi+v//PxMDw3+m//8ZoPR/qBgDEhuXGLoeYswhXg8R5gAAdVpfoJ3dB5oAAAAASUVORK5CYII=) 100% 100%;
         background: -moz-linear-gradient(top, #32323a 0%, #141414 100%);
         background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #32323a), color-stop(100%, #141414));
         background: -webkit-linear-gradient(top, #32323a 0%, #141414 100%);
         background: -o-linear-gradient(top, #32323a 0%, #141414 100%);
         background: -ms-linear-gradient(top, #32323a 0%, #141414 100%);
         background: linear-gradient(to bottom, #32323a 0%, #141414 100%);
         color: #ffffff;
         display: inline-block;
         font-family: Helvetica, Arial, Verdana, sans-serif;
         font-size: 13px;
         line-height: 49px;
         padding: 0 20px;
         text-decoration: none;
        }
        #cssmenu ul {
         list-style: none;
        }
        #cssmenu > ul {
         float: left;
        }
        #cssmenu > ul > li {
         float: left;
        }
        #cssmenu > ul > li:hover:after {
         content: '';
         display: block;
         width: 0;
         height: 0;
         position: absolute;
         left: 50%;
         bottom: 0;
         border-left: 10px solid transparent;
         border-right: 10px solid transparent;
         border-bottom: 10px solid #0fa1e0;
         margin-left: -10px;
        }
        #cssmenu > ul > li:first-child > a {
         border-radius: 5px 0 0 0;
         -moz-border-radius: 5px 0 0 0;
         -webkit-border-radius: 5px 0 0 0;
        }
        #cssmenu > ul > li:last-child > a {
         border-radius: 0 5px 0 0;
         -moz-border-radius: 0 5px 0 0;
         -webkit-border-radius: 0 5px 0 0;
        }
        #cssmenu > ul > li.active > a {
         box-shadow: inset 0 0 3px #000000;
         -moz-box-shadow: inset 0 0 3px #000000;
         -webkit-box-shadow: inset 0 0 3px #000000;
         background: #070707;
         background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAxCAIAAACUDVRzAAAAA3NCSVQICAjb4U/gAAAALklEQVQImWNQU9Nh+v//PxMDw3+m//8ZkNj/mRgYIHxy5f//Z0BSi18e2TwS5QG4MGB54HL+mAAAAABJRU5ErkJggg==) 100% 100%;
         background: -moz-linear-gradient(top, #26262c 0%, #070707 100%);
         background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #26262c), color-stop(100%, #070707));
         background: -webkit-linear-gradient(top, #26262c 0%, #070707 100%);
         background: -o-linear-gradient(top, #26262c 0%, #070707 100%);
         background: -ms-linear-gradient(top, #26262c 0%, #070707 100%);
         background: linear-gradient(to bottom, #26262c 0%, #070707 100%);
        }
        #cssmenu > ul > li:hover > a {
         background: #070707;
         background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAxCAIAAACUDVRzAAAAA3NCSVQICAjb4U/gAAAALklEQVQImWNQU9Nh+v//PxMDw3+m//8ZkNj/mRgYIHxy5f//Z0BSi18e2TwS5QG4MGB54HL+mAAAAABJRU5ErkJggg==) 100% 100%;
         background: -moz-linear-gradient(top, #26262c 0%, #070707 100%);
         background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #26262c), color-stop(100%, #070707));
         background: -webkit-linear-gradient(top, #26262c 0%, #070707 100%);
         background: -o-linear-gradient(top, #26262c 0%, #070707 100%);
         background: -ms-linear-gradient(top, #26262c 0%, #070707 100%);
         background: linear-gradient(to bottom, #26262c 0%, #070707 100%);
         box-shadow: inset 0 0 3px #000000;
         -moz-box-shadow: inset 0 0 3px #000000;
         -webkit-box-shadow: inset 0 0 3px #000000;
        }
        #cssmenu .has-sub {
         z-index: 1;
        }
        #cssmenu .has-sub:hover > ul {
         display: block;
        }
        #cssmenu .has-sub ul {
         display: none;
         position: absolute;
         width: 200px;
         top: 100%;
         left: 0;
        }
        #cssmenu .has-sub ul li {
         *margin-bottom: -1px;
        }
        #cssmenu .has-sub ul li a {
         background: #0fa1e0;
         border-bottom: 1px dotted #6fc7ec;
         filter: none;
         font-size: 11px;
         display: block;
         line-height: 120%;
         padding: 10px;
        }
        #cssmenu .has-sub ul li:hover a {
         background: #0c7fb0;
        }
        #cssmenu .has-sub .has-sub:hover > ul {
         display: block;
        }
        #cssmenu .has-sub .has-sub ul {
         display: none;
         position: absolute;
         left: 100%;
         top: 0;
        }
        #cssmenu .has-sub .has-sub ul li a {
         background: #0c7fb0;
         border-bottom: 1px dotted #B82C00;
        }
        #cssmenu .has-sub .has-sub ul li a:hover {
         background: #095c80;
        }

Olá amigo,

Agora adicione este código CSS:

Código:

#cssmenu a, #cssmenu li, #cssmenu span, #cssmenu ul {
text-align: center;
position: relative;
left: 8pc;
}

Até mais.

Está quase como eu quero , o unico erro é que a imagem que aparece quando passa o mouse esta desalinhada , como mostro nesta imagem-->aqui

Modifiquei a distancia do codigo pois o seu estava muito para a direita

o codigo:

Código:

#cssmenu a, #cssmenu li, #cssmenu span, #cssmenu ul {
text-align: center;
position: relative;
left: 2pc;
}

Olá amigo!

Re-ative o menu por gentileza.

Até mais.

Sheldon Já reativei o menu agora você poderá visualizar o erro você mesmo  

Olá!

Troque por este, o menu ficará corrigido porém à esquerda.

Código:

#cssmenu a, #cssmenu li, #cssmenu span, #cssmenu ul {
left: 0pc;
position: relative;
text-align: center;
}

Até mais!

Prince voce nao entendeu o meu erro entao vou explicar novamente;

O meu menu ja esta para a esquerda , mas eu queria que ele ficasse centralisado mas quando eu coloco o codigo aparece esse erro --> aqui.

se nao entender eu explico novamente  

Esta é a imagem do resultado que obtive com o código que acabei de lhe ceder:

https://2img.net/r/ihimg/scaled/landing/547/rdse.jpg

sim , mas o resultado que eu qqquero é este

aqui

Bom dia cordial membro!

Aceda a: Painel de controleVisualização  Imagens e CoresCoresAba Folha CSS.

Código:

#cssmenu a {
position: relative !important;
left: 31pc !important;
}
#cssmenu > ul > li:hover:after {
margin-left: 484px !important;
position: absolute;
width: 0;
}


<li> Coloque o código no inicio de teu CSS.

Valide e veja o resultado.

Abraços!

Se quiserem já podem fechar tópico , irei manter o menu com esta mesmo, assim vocês não iram ficar mais estressados com o meu tópico . Irei colocar o ícone de resolvido para poderem já fechar