Ho realizzato un menu orizzontale con questo codice:
codice:
#navbarwrapper {clear:both; width:98%; height:50px; margin:0 auto; background-color:#1E247C}
#navbar ul{height:50px; line-height:2.8; list-style:none; margin:0 auto; padding:0; text-align:center; background-color:#1E247C}
#navbar li{display:inline; margin:0 auto; padding:4px 6px; background:white; color:#E03011}
#navbar a{background:white; padding:4px 0 3px; color:#1E247C; text-decoration:none}
#navbar a:hover{background:white; color:black; text-decoration:underline}
In IE (ho verificato le versioni 5.5, 6 e 7) le caselle non erano separate,
col rosultato che li menu appariva come un'unica striscia bianca con le voci.
Allora ho adottato una versione alternativa con un commento condizionale:
codice:
#navbarwrapper {clear:both; width:98%; height:50px; margin:0 auto}
#navbar ul{height:30px; line-height:50px; list-style:none; text-align:center; background-color:#1E247C}
#navbar li{display:inline; margin:0 4px; background:white; color:#E03011}
#navbar a{background:white; color:#1E247C; text-decoration:none}
Ora le voci sono separate, ma le caselle molto più ampie di quanto
dovrebbero e, non capisco il motivo, la casella selezionata (effetto hover)
risulta puù stretta delle altre.
Se non capite che cosa intendo, vedete qui con Firefox e poi con IE:
http://samiel.netsons.org
Come potrei migliorare la resa ed evitare quelo strano effetto di restringimento?

Grazie
M.