Con il vostro aiuto sto cercando di realizzare un menu a tendina orizzontale su tre livelli.
Menu a sfondo nero, hover sfondo rosso, però funziona male.
Dal 1 al 2 livello funziona.
Passando sul 2. livello si apre bene il terzo ma le voci del terzo livello anzichè aprirsi a sfondo nero e poi diventare rosse al passaggio del mouse, si aprono a sfondo rosso e così restano.
Non so bene in effetti dove impostarle nel foglio di stile, che ho messo insieme con un collage! Non ci capisco + niente!
Qualcuno mi puo aiutare?
Grazie!!!!!!! Tappat

Questo è il codice del .css:
.menu
{
float: left;
width: 565px;
height: 55px;
padding-left: 16px;
padding-right: 6px;
padding-top: 22px;
text-align: center;
font-family: Verdana;
font-size: 8pt;
color: #FFFFFF;
}
.menu ul
{
list-style:none;
margin:0;
padding:0;
}
.menu a {
display:block;
color: #FFFFFF;
text-decoration:none;
font-weight:normal;
line-height:30px;
margin:0px;
padding:0px 15px;
text-align:center;
font: Verdana, Tahoma, sans-serif;
}
.menu a:hover {
background: url(../images/hover.png) #ad0101 no-repeat bottom center;
color:#FFFFFF;
text-decoration:none;
}
.menu li{
float:left;
padding:0px;
position: relative;
}
.menu ul ul
{
position: absolute;
z-index: 500;
}
.menu ul ul ul {
position: absolute;
top: 0;
left: 100%;
}

div.menu ul ul,
div.menu ul li:hover ul ul,
div.menu ul ul li:hover ul ul
{display: none;}

div.menu ul li:hover ul,
div.menu ul ul li:hover ul,
div.menu ul ul ul li:hover ul
{display: block;}

.menu li a{
display:block;
font-weight:normal;
line-height:30px;
margin:0px;
padding:0px 15px;
text-align:center;
text-decoration:none;
color: #FFFFFF;
}
.menu li.current a
{
display: block;
font-weight: normal;
line-height: 30px;
margin: 0px;
padding: 0px 15px;
text-align: center;
text-decoration: none;
color: #FFFFFF;
background-position: center bottom;
background-image: url(../images/current.png);
background-repeat: repeat-x;
}
.menu li a:hover, .menu ul li:hover a{
background: url(../images/hover.png) #ad0101 no-repeat bottom center;
color:#FFFFFF;
text-decoration:none;
}
.menu li ul{
background:#2F3130;
display:none;
height:auto;
padding:0px;
margin:0px;
border:0px;
position:absolute;
width:225px;
z-index:200;
}
.menu li:hover ul{
display:block;
}
.menu li li
{
display: block;
float: none;
margin: 0px;
padding: 0px;
width: 225px;
background-image: url(../images/sep.gif);
background-repeat: no-repeat;
background-position: left bottom;
}
.menu li:hover li a{
background:none;
}
.menu li ul a{
display:block;
height:30px;
font-size:10px;
font-style:normal;
margin:0px;
padding:0px 10px 0px 15px;
text-align:left;
}
.menu li ul a:hover, .menu li ul li:hover a
{
background: url(../images/hover_sub.png) #ad0101 no-repeat left center;
border: 0px;
color: #ffffff;
font-size: 10px;
text-decoration: none;
}

scusa ma la magg parte dei siti ha menu orizz (vedi aspitalia) e tantissimi a questo hanno aggiunto sub menu che scendono a tendina. dove sta il problem?
si raggruppano gli argomenti nei menu livello 1 (minerali, vegetali, animali, ...)e si creano sottomenu (bauxite, galena...) che possono aprirsi in altri sottomenu (dove si estrae, utilizzo...)

stabilito che ho sbaglato grammaticalmente il titolo, lo correggo:
NON FUNZIONA MENU ORIZZONTALE A TENDINA.
qualche suggerimento su cosa devo modificare nel css? ciao