Problemi di visualizzazione dei menu laterali!

[spiadadda]

Ciao a tutti è da poco che mi sto cimentando nello studio dei css e per fare pratica, dove aver letto tantissimo sia sul sito che qui nel forum, sto facendo un sito di prova.

Oggi ho fatto un test ed in particolare sembra funzionare tutto bene con i broswer Explorer, firefox e Opera, ma ho un piccolo problema di risoluzione con Explorer 5.00

Il problema riguarda i menu laterali, i quali risultano più larghi rispetto alle dimensioni impostate e quindi tutto il layuot si sballa. Vi posto il codice:
HTML

<div id="int_nav_lat">menu laterali</div> 
<ul id="nav_lat">
<li id="nav_lat">VLINK1
<li id="nav_lat">VLINK2
<li id="nav_lat">VLINK3
<li id="nav_lat">VLINK4[/list]
<div id="nav_lat-footer"></div>

CSS

/* Navigazione laterale ==> Link*/
ul#nav_lat{
	width:130px;
	margin: 0 auto;
	padding: 0px;
	list-style: none;
	background-color: #99CC66;	
}
li#nav_lat{
	width:130px;
	margin: 0 auto;
	padding: 0;
	border-top: 0px;
	border-left: 0px;
	border-bottom: 1px solid #669933;
	border-right: 0px;
	line-height: 22px;
	list-style: none;
	text-align: left;
	background-image:  url("sf_nav.gif");
	background-repeat: repeat-x;
	background-position: top left;
	background-color: #99CC66;
	
}
ul#nav_lat a{
	text-decoration: none;
        border: 0px;
	padding: 2px;
       color: #003300;
	font-weight: bold;
}
	
ul#nav_lat a:visited {
	text-decoration: none;
}
ul#nav_lat a:hover {
	text-decoration: underline;
	color: #009900;
		 
}
ul#nav_lat a:active {
	text-decoration: none;
}

Il problema riguarda gli [*] infatti questi si vedono più largi delle dimensioni specificate nei css e quindi tutto il layout si sballa. Ho notato che anche sul sito HTML.it succede la stessa cosa.
E' possibile risolvere questo problema?

Inoltre poi ho controllato il sito di prova con Netscape 6 VVoVe: VVoVe: un vero disastro. Ma la cosa mi che conforta che moltissimi siti hanno lo stesso problema!

Spero pero di risolvere almeno il problema con explorer 5.00

Aspetto vostri suggerimenti.
Grazoe 1000

[mahamatt]

Ciao,
purtroppo non so aiutarti per il problema che esponi. In ogni caso non fasciarti la testa; anche se raggiungere la "compatibilità crossbrowser universale" è l'utopia di ogni webmaster, tieni presente che explorer 5.x è oramai utilizzato da un'utenza che non supera il 2%

Però ho notato alcuni errori nel codice che hai postato, mi permetto di darti un suggerimento:

<ul id="nav_lat">
<li id="nav_lat">VLINK1
<li id="nav_lat">VLINK2
<li id="nav_lat">VLINK3
<li id="nav_lat">VLINK4[/list]

ID serve ad indicare UN SOLO elemento in modo univoco. Se lo applichi alla lista, è errato (e non occorre) che lo specifichi ad ogni[*]. Puoi alleggerire il codice in questo modo:

<ul id="nav_lat">[*]VLINK1[*]VLINK2[*]VLINK3[*]VLINK4[/list]

Nel css devi sostituire li#nav_lat { ... } con ul#nav_lat li { ... } ed il codice è snelito

[spiadadda]

Ciao e grazie,
ho fatto in quel modo perchè altrimenti perdo l'immagine di sfondo nel tag[*]

E possibile rimediare?

[spiadadda]

OK come non detto!
Ho capito dove sbagliavo... grazie infinite per il consiglio!

[mahamatt]

Originariamente inviato da spiadadda
ho fatto in quel modo perchè altrimenti perdo l'immagine di sfondo nel tag[*]

Questo non dovrebbe accadere...
hai testato su più browser? se sì, quali?

[mahamatt]

ah ok, ho postato la domanda prima di leggere la tua risposta

per il problema iniziale però non so che dirti...