Ciao a tutti. Sono un nuovo utente del forum e da poco più di una settimana ho iniziato a creare un sito interamente in css.
I problemi maggiori che ho riscontrato sono il posizionamento del rollover e della sua relativa visualizzazione.
Ma partiamo dal principio:
Il sito in questione è elledan.it.(non posso inserire il link)
Come si può vedere ho creato un rollover con un menu a tendina e non riesco a centrarlo.
Premetto che ho spulciato il forum e ho letto altri post che trattano l'argomento, ma seguendo alcune indicazioni non sono riuscito a risolvere il problema.
La mia intenzione è metterlo al centro pagina sotto il titolo (Elledan).

Un altro problema è quello che le sezioni del rollover che hanno un menu a tendina vengono visualizzate senza rollover. In poche parole si può vedere che nei box 1,4 e 5 passandoci il mouse sopra l'immagine si "illumina" ma questo non avviene nei box 2 e 3 (che hanno il menu a tendina). Il mio scopo è quello di dare un format unico a tutti i box, quindi anche il box 2 e 3 dovrebbero illuminarsi al passaggio del mouse oltre ad aprire il menu a tendina.

Ps:
Non fate caso ad alcuni errori che si visualizzano nel menu a tendina (me ne occuperò con calma). Inoltre con IE potrebbe dare problemi di visualizzazione (anche di questo me ne occuperò con calma). Lo sto sviluppando con mozilla.

Copio il codice css del rollover:

/* MENU PRINCIPALE /
.menuNavigazione{
margin:0;
padding:0;
list-style:none;
height:2em;
background-image:url('PulsanteB.png');
width: 500px;
background-position: 50% 50%;
}
.menuNavigazione li{
float:left;
position:relative;
}
.menuNavigazione a{
float:left;
height:2em;
line-height:2em;
padding:0 10px;
text-decoration:none;
height: 33px; /meta dallimmagine/
width: 80px;
text-indent: 10000px;
overflow: hidden;
}
/ SOTTO MENU /
.menuNavigazione ul{
margin:0;
padding:0;
list-style:none;
width:17em;
}
.menuNavigazione ul li{
float:none;
}
.menuNavigazione ul a{
float:none;
display:block;
height:1.8em;
line-height:1.8em;
}
/ MENU ON OFF /
.menuNavigazione ul,
.menuNavigazione ul.subMenu-off{
position:absolute;
visibility:hidden;
}
.menuNavigazione ul.subMenu-on{
visibility:visible;
}
/ POSIZIONAMENTO DEL SOTTO MENU /
.menuNavigazione ul.subMenu-on{
position:absolute;/ primo livello di annidamento:menu a discesa /
top:2em;
left:-1px;
visibility:visible;
border-top:1px solid #000;
}
.menuNavigazione ul.subMenu-on ul.subMenu-on{
margin:0 0 0 -1px;/ livelli di annidamento superiori al primo:menu a comparsa laterale /
width:17em;
position:absolute;
top:-1px;
left:17em;
border-top:1px solid;
}
/ COLORI /
.menuNavigazione{
}
.menuNavigazione a{
background-image:url('PulsanteB.png');
}
/ EFFETTO ROLLOVER /
.menuNavigazione a:hover,
.menuNavigazione a:focus,
.menuNavigazione a:active{
text-decoration:underline;
background-image:url('PulsanteB2.png');
}
/ FRECCETTE */
.menuNavigazione a.continua{
background:url(continuaOrz.gif) center bottom no-repeat;
}
.menuNavigazione ul a.continua{
background:url(continua.gif) right center no-repeat;
}
Posizionamento dei div:

<div id="menuNavigazione"><div class="innertube">
<ul class="menuNavigazione">
<li><a href="#"></a></li>
<li><a href="#" class="continua"></a>
<ul>
<li><a href="#"></a></li>
<li><a href="#" class="continua"></a>
<ul>
<li><a href="#"></a></li>
<li><a href="#"></a></li>
<li><a href="#"></a></li>
</ul>
</li>
<li><a href="#"></a></li>
</ul>
</li>
<li><a href="#" class="continua"></a>
<ul>
<li><a href="#"></a></li>
<li><a href="#"></a></li>
<li><a href="#"></a></li>
</ul>
</li>
<li><a href="#"></a></li>
<li><a href="#"></a></li>
</ul>

</div>

Grazie in anticipo.