Ciao!
In questi giorni sto creando il nuovo sito www.maidiredieta.com, che presto sarà online.

Sono incappata in un problema: ho un menù orizzontale, che si estende per tutta la parte superiore della pagina. Al passaggio del mouse si aprono i vari sottomenu, che prima erano nascosti con un display:none.

Il problema è che gli altri elementi sottostanti sono molto vicini al menu e quando questo si espande, passa sotto a questi elementi, con un pessimo effetto. Le ho provate un pò tutte, ma alla fine ho trovato questa bellissima proprietà css: z-index.

z-index permette di lavorare con gli elementi html a livelli, esattamente come si fa nei programmi di grafica.

L'elemento BODY è considerato al livello z-index 0, mentre gli altri elementi sono posizionati al livello z-index 1. Quindi se si vuol posizionare un elemento ad un livello superiore, basta impostare il suo z-index ad un valore maggiore uguale a 2. La regola generale è che l'elemento con il maggiore z-index sarà visibile e coprirà gli altri.

Per risolvere il mio problema, quindi ho impostato il menu in questo modo: