Ciao a tutti. innanzitutto mi presento perchè sono nuovo del forum.. Sono Simone e ho 19 anni e faccio la classe 5^ di un'ITIS ovviamente indirizzo Informatica..
Veniamo al dunque. ho creato un menù in css e per riuscire a capire bene come posizionare gli elementi ci ho passato alcune ore (è la mia prima esperienza con il CSS). sono arrivato alla fine ma ho del problemi con la funzione z-index. in pratica non riesco a farlo funzionare.. vi posto la parte del codice del menù e il file css allegando un immagine per farvi capire che cosa vorrei ottenere..


Codice Html:

codice:
<div id='menu'>
	<ul class='lv'>
		<li class='lv'>Pc
				<ul class='sub'>
					<li class='sub'>Registrazione Pc
				[/list]
		
		<li class='lv'>d
				<ul class='sub'>
					<li class='sub'>1
					<li class='sub'>2
				[/list]
		
	[/list]
</div>
E questo è il codice CSS:

codice:
#menu{
padding: 0;
border: none;
}


#menu ul.lv{

position: 			relative;
display: 			block;
margin: 			0;
background-color:	#778899;
border:             	3px solid black;
border-top:      	none;  
width: auto;
height: 15px;;
-webkit-border-radius: 0 0 25px 25px; /* smussamento angoli per Safari e Chrome*/
-moz-border-radius:    0 0 25px 25px; /* smussamento angoli per Firefox */

}


#menu ul li.lv{
position:			relative;
display: 			block;

top: 				100%;
float: 			left;

list-style: 		none;
margin-right: 		6px;
padding-bottom:		8px;

border:             	3px solid black;
border-top:      	none; 

width: 			90px;
height: 			20px;


text-decoration:		none;
text-align: 		center;

background-color:	white;

-webkit-border-radius: 0 0 25px 25px; /* smussamento angoli per Safari e Chrome*/
-moz-border-radius:    0 0 25px 25px; /* smussamento angoli per Firefox */


}

#menu ul li:hover.lv{
position:			relative;

border:             	4px solid red;
border-bottom-color:   red;  

height: 25px;

background-color: 	green;

-webkit-border-radius: 25px 25px 0 0; /* smussamento angoli per Safari e Chrome*/
-moz-border-radius:    25px 25px 0 0; /* smussamento angoli per Firefox */
z-index: 2;
}

/*stile generale dei list item*/


/*style generale dei link*/
#menu a{
		
		
		text-decoration:none;
		text-align: center;
		line-height: 30px;	
		font-family: Verdana;
		font-size: 9px;
		font-weight: bold;
}

 /* stile sottomenù*/
#menu ul li ul.sub{

visibility: 		hidden;

position: 			relative;
left: 			-4px;
top: 				-10px;
border:             	4px solid black;

background-color: 	red;
display: 			block;


min-width: 		100px;
min-height: 		10px;
height: 			auto;

text-align: 		center;
}

#menu ul li:hover ul.sub{
visibility:		visible;

-webkit-border-radius: 0 25px 25px 25px; /* smussamento angoli per Safari e Chrome*/
-moz-border-radius:    25px 25px 0 0; /* smussamento angoli per Firefox */

}
#menu ul li ul li.sub{
left: -30px;
position: relative;
display: block;
list-style: none;
}
In pratica voglio l'UL' secondario sopra l' 'IL' principale 'hover' ho provato in tutti i modi ma non ci riesco..

Img Menù