[HTML+CSS] Assegnare stile ad una classe

[Abdujaparov]

Salve a tutti sto provando ad assegnare uno stile ad una classe e sto incontrando parecchi problemi.
Ho definito nel css questi stili:

.normale{background-color: #ffffff;border-bottom: 1px solid #787878;text-align:center}
div#navigation ul{list-style-type: none;margin: 0;padding: 0;white-space: nowrap}
div#navigation li{display: inline;margin: 0;padding:0}
div#navigation li a{text-decoration: none;border: 1px solid #787878;padding: 0px 0.3em;
background: #ccc;color: #036}
div#navigation li a:hover{background-color: #f0f0f0}
.activelink a{border-bottom: 1px solid #fff;background-color: #fff;color: #603}


Che vorrei applicare a questa lista:

<div id="navigation">
<ul>
<li id="infoEl" class="activelink" onClick="display_blockInfo()"><a href="#">Info</a></li>
<li class="normale" id="rischioEl" onClick="display_blockRischio()"><a href="#">Rischio</a></li>
<li class="normale" id="varEl" onClick="display_blockVar()"><a href="#">Varianza</a></li>
<li class="normale" id="azioniEl" onClick="display_blockAzioni()"><a href="#">Azioni</a></li>
<li id="bondEl" class="normale" onClick="display_blockBond()"><a href="#">Bond</a></li>
<li id="emittenteEl" class="normale" onClick="display_blockEmittente()"><a href="#">Emittente</a></li>
<li id="garanteEl" class="normale" onClick="display_blockGarante()"><a href="#">Garante</a></li>
<li id="governanceEl" class="normale" onClick="display_blockGovernance()"><a href="#">Governance</a></li>
<li id="formulaEl" class="normale" onClick="display_blockFormula()"><a href="#">Formula</a></li>
</ul>
</div>


Io ho scritto solo le parti relative alle classi normale e activelink.
Ho il seguente problema queste classi non vengono applicate agli elementi della lista perchè?
Come posso farle associare?
Grazie a tutti, ciao ciao.