macsig Inviato 21 Settembre 2007 Segnala Condividi Inviato 21 Settembre 2007 Ciao, sto creando un menu orizzontale a 2 livelli ed ho il seguente problema: vorrei che il menu di primo livello fosse posizionato "sopra" a quello di secondo in quanto quello di secondo livello ha un bordo colorato che vorrei non fosse visibile dove c'e' l'elemento di primo livello selezionato. Ho provato a settare per z-index:0 per il "sub" ed z-index:1 per il "main" ma senza successo. Questo e' il codice #nav { position: absolute; top: 80px; } #nav ul { margin: 0px; list-style: none; padding: 0px; } #nav li { float: left; color: #fff; background: #C43219 url(images/nav.gif) no-repeat 0px 0px; margin: 0px; padding:0px 0px 0px 10px; } #nav a { float: left; display: block; color: #fff; padding: 10px 20px 5px 10px; background: #C43219 url(images/nav.gif) no-repeat 100% 0px; text-decoration: none; font-weight: bold; } #nav a:hover { color:#BFE1ED; } #nav .current li { background: #1995C2 url(images/nav.gif) no-repeat 0 -41px; color: #fff; border-style: solid; border-width: 0px 0px 1px 0px; border-color:#0000CC; z-index: 1; } #nav .current li a { background: #1995C2 url(images/nav.gif) no-repeat 100% -41px; padding: 10px 20px 5px 10px; color: #fff; z-index: 1; } #nav .sub { display: none; z-index: 0; } #nav .current .sub { display:block; position:absolute; top:20px; left:0px; width: 800px; background-color: #fff; border-style: solid; border-width: 1px 1px 0px 1px; border-color: #666666; z-index: 0; } #nav .tab a:hover .sub, #nav .tab li:hover .sub { display:block; position:absolute; top:30px; left:0px; width: 800px; background-color:#fff; border-style: solid; border-width: 1px 1px 0px 1px; border-color: #666666; z-index: 0; } #nav .current .sub li { display: inline; background: #fff; padding: 10px 0px 5px 10px; width: auto; height: 18px; white-space: nowrap; font-weight: normal; font-size: 12px; z-index: 0; } #nav .tab a:hover .sub li , #nav .tab li:hover .sub li { display: inline; background: #fff; padding: 10px 0px 5px 10px; width: auto; height: 18px; white-space: nowrap; font-weight: normal; font-size: 12px; z-index: 0; } #nav .current .sub li a { display: inline; color: #666666; background: #fff; width: auto; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; white-space: nowrap; font-weight: normal; font-size: 12px; height: 18px; z-index: 0; } #nav .tab a:hover .sub li a, #nav .tab li:hover .sub li a { display: inline; color: #666666; background: #fff; width: auto; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; white-space: nowrap; font-weight: normal; font-size: 12px; height: 18px; z-index: 0; } <div id="nav"> <ul class="current"> <li><a href="#">Posta</a> <ul class="sub"> <li><a href="#">function</a></li> <li><a href="#">function</a></li> <li><a href="#">function</a></li> <li><a href="#">function</a></li> <li><a href="#">function</a></li> </ul> </li> </ul> <ul class="tab"> <li><a href="#">Commerciale</a> <ul class="sub"> <li><a href="#">function2</a></li> <li><a href="#">function2</a></li> <li><a href="#">function2</a></li> <li><a href="#">function2</a></li> <li><a href="#">function2</a></li> </ul> </li> </ul> <ul class="tab"> <li><a href="#">Main2</a></li> </ul> <ul class="tab"> <li><a href="#">Main3</a></li> </ul> </div> Dove sbaglio ??? Alla Prossima... Link al commento Condividi su altri siti Altre opzioni di condivisione...
macsig Inviato 22 Settembre 2007 Autore Segnala Condividi Inviato 22 Settembre 2007 RISOLTO, nel senso che modifico la struttura del menu, in accordo con l'ultimo articolo di Jakob Nielsen. Non mi permetto ancora di contraddirlo :ciao: Alla Prossima... Link al commento Condividi su altri siti Altre opzioni di condivisione...
grigio60 Inviato 23 Settembre 2007 Segnala Condividi Inviato 23 Settembre 2007 Jakob Nielsen :ooooh::ooooh: Serve aiuto? Posso darti una mano in Webmasters - Aiuto Software - Da Windows a Mac Mappa Utenti ItaliaMac [[miao]] Link al commento Condividi su altri siti Altre opzioni di condivisione...
Messaggi raccomandati
Archiviato
Questa discussione è archiviata e chiusa a future risposte.