Ciao a tutti, sto creando un menu di navigazione con dei sotto-menù.
Fino a qui tutto ok. Nel momento in cui inserisco i sotto-menù dei sotto-menù non funziona più.
codice:
<div id="navigation"> 
<ul> 
<li class="software"> 
 Assistenza software 

 <ul> 
<li class="primo software stop">Assistenza software 
<li class="software stop">Utility &amp; Software 
<li class="software stop">Antivirus 
<li class="software">Programmazione 

 <ul> 
<li class="primo software stop">Programmazione web 
<li class="software stop">.NET 
<li class="software stop">Java 
<li class="software stop">C/C<sup>++</sup> 
<li class="ultimo software stop">Altri [/list]

<li class="software stop">Lan &amp; Wireless 
<li class="ultimo software stop">Miscellaneus 
 [/list]
[/list]
</div>
Codice CSS:
codice:
#navigation ul {list-style-type:none; margin: 0; padding: 0}
#navigation li {position:relative; border: 1px inset gray; border-bottom: 0; width: 150px; height: 25px; margin: 0; padding: 0; background: url(http://mirkosalaris.altervista.org/p...nu/Freccia.png) no-repeat 98% center}
#navigation li.primo {border-radius: 3px 3px 0 0}
#navigation li.ultimo {border-bottom: 1px inset gray; border-radius: 0 0 3px 3px}
#navigation a {display:block; position:relative; top: 50%; margin-top: -8px; width: 150px; height: 25px; text-align:left; text-indent: 3px; font: 11px tahoma, sans-serif}
#navigation li.software {background-color:hsl(30, 100%, 40%)}
#navigation li.software:hover{background-color:hsl(30, 100%, 50%)}
#navigation li:hover {background-position: 100% center}
#navigation .stop {background-image:none}

#navigation li ul {display:none}
#navigation li:hover > ul {display:block; position:absolute; left: 151px; top: 0}
Il codice evidenziato in rosso è quello che non funziona come vorrei.

Ciò che dovrebbe succedere è questo:
Passo il mouse su una voce di menu e si vede il sotto-menù.
Passo il mouse sulla quarta (dico la quarta perchè è l'unica in cui mi serve il sotto-menù) voce del sotto-menù e appare anche il sotto-sotto-menù.

Ho provato in moltissimo modi ma non comprendo il perchè non accada. Utilizzando il CSS postato il sotto-sotto-menù non appare.
Eliminando il selettore di discendenza diretta (>) quando passo il mouse sulla prima voce del menù appaiono sia il sotto-menù che il sotto-sotto-menù .-.

Dovrei riuscire a risolvere utilizzando degli ID... ma mi interesserebbe comprendere il perchè nel modo postato non funziona.
Inserendo lo spazio tra "#navigation" e "li" la regola dovrebbe essere valida per tutti gli "li" discendenti, mentre sembra che sia valida solo per il diretto discendente.

Qualcuno può delucidarmi a riguardo?