Menu tabs: link attivo con diverso colore

[sustia]

Allora, ho dei problemi.
Il css che suggeriscono lì sembra non funzionare sul mio, mi dà un po' di casini, e quindi l'ho modificato così

.navigation a {
      float:left;
      background:url("http://noria.ba.cnr.it/img/menu/tableftC.gif") no-repeat left top;
      margin:0;
      padding:0 0 0 4px;
      text-decoration:none;
        font-weight: bold;
      }
.navigation a span {
      float:left;
      display:block;
     background:url("http://noria.ba.cnr.it/img/menu/tabrightC.gif") no-repeat right top;
      padding:5px 15px 4px 6px;
      color:#464E42;
        font-weight: bold;
        text-decoration:none;
      }
    /* Commented Backslash Hack hides rule from IE5-Mac \*/
    .navigation a span {float:none; text-decoration:none;}
    /* End IE5-Mac hack */
    .navigation a:hover span {
      color:#FFF;
        text-decoration:none;
      }
    .navigation a:hover {
      background-position:0% -42px;
        text-decoration:none;
      }
    .navigation a:hover span {
      background-position:100% -42px;
        text-decoration:none;
      }
         .navigation #currentpage a {
      float:left;
      background:url("http://noria.ba.cnr.it/img/menu/tableftC.gif") no-repeat left top;
      margin:0;
      padding:0 0 0 4px;
      text-decoration:none;
        font-weight: bold;
          background-position:0% -42px;
        text-decoration:none;
        color: #cccc00;
      }
.navigation #currentpage a span {
      float:left;
      display:block;
     background:url("http://noria.ba.cnr.it/img/menu/tabrightC.gif") no-repeat right top;
      padding:5px 15px 4px 6px;
      font-weight: bold;
        text-decoration:none;
        background-position:100% -42px;
        text-decoration:none;
      }
    /* Commented Backslash Hack hides rule from IE5-Mac \*/
    .navigation #currentpage a span {float:none; text-decoration:none;}
    /* End IE5-Mac hack */
     .navigation #currentpage a:hover {
      background-position:0% -42px;
        text-decoration:none;
      }
    .navigation #currentpage a:hover span {
      background-position:100% -42px;
        text-decoration:none;
      } 

ed il codice che mi restituisce è il seguente

<div class="navigation">
<ul>
[url="index.php?id=3,0,0,1,0,0"]<span id="currentpage">Azienda</span>[/url]
[url="index.php?id=9,0,0,1,0,0"]<span>Gruppo di ricerca</span>[/url]
[url="index.php?id=20,0,0,1,0,0"]<span>Attività di ricerca</span>[/url]
<a href="index.php?id=10,0,0,1,0,0"><span>Progetti</span>
</a>
<a href="index.php?id=13,0,0,1,0,0"><span>Servizi/Utilità</span>
</a>
<a href="index.php?id=18,0,0,1,0,0"><span>Contatti</span>
</a>
<a href="index.php?id=19,0,0,1,0,0"><span>Newsletter</span>
</a>[/list]
</div> 

anche se vedo la classe sembra non funzionare, e mi sposta tutto il menu al centro.