Lista e span, un bug?

[koal]

Ciao a tutti!
Ho una lista verticale classica:

<div id="navcontainer">
<ul id="navlist">[*]Item one[*]Item two[*]Item three[*]Item four[*]Item five[/list]
</div>

e il css è questo:

 #navcontainer { 
 position:absolute;
 margin-top: 0px;
	margin-left: 195px;
	width: 193px;	
	height: 108px;}

#navcontainer ul {
margin: 0;
padding: 0;
list-style-type: none;
font-family: Arial, Helvetica, sans-serif;
}

#navcontainer a{
display: block;
padding: 3px;
width: 187px;
/*background-color: #036;
border-bottom: 1px solid #eee;*/
}

#navcontainer a:link, #navlist a:visited
{
color: #FFF;
text-decoration: none;
}

Ora però ho necessità di modificare l'attributo lang per alcune parole che compongono il menu, e per far questo utilizzo uno span (esempio:"Eventi e <SPAN LANG="en">news</SPAN>"). Quando faccio quest'operazione mi si sballano tutte le altezze e il menu non si mantiene piu' all'interno del blocco.
Ho anche provato a mettere nel css questo

#navcontainer a, #navcontainer a span {
display: block;
padding: 3px;
width: 187px;
/*background-color: #036;
border-bottom: 1px solid #eee;*/
}

ma niente...
Sapreste aiutarmi? Grazie!

[pierofix]

Forse è perchè dichiari lo span un block: credo sia quello che sballa tutto.

[koal]

Questo nel secondo tentativo, che in effetti avevo visto fare da qualche parte (nn ricordo dove) poichè c'era un problema di compatibilità con IE. In effetti su mozilla non è un bug, e cmq, tenendo conto del primo codice css il block è applicato all'ancora. Se metto:

Eventi e <SPAN LANG="en">news</SPAN>

su IE il testo si formatta:
Eventi e
news
mandando a capo la parola compresa nello span... perchè?

[pierofix]

Se applichi la proprietà block allo span, per forza che ti va a capo.

Forse hai settato una larghezza fissa per i tag a nella lista?

[Marcolino's]

Hai definito l'ancora <a> larga 187px ma è un errore di .. stile, puoi darlo alla lista <ul> ma non all'ancora.

Non solo, ma ti sconsiglio di definire che news è inglese, dato che i lettori di schermo leggerebbero la parola proprio in inglese, che è molto diverso dal sentirlo pronunciato all'italiana.
In pratica è meglio che in un testo italiano, le parole inglesi vengano pronunciate "all'italiana", perché così risultano più comprensibili.
Nel tuo esempio: news = nnuus (in inglese), con la prima u molto nasale, mentre diventa nius all'italiana.

[koal]

Se specifico la larghezza in UL anzicchè nell'ancora l'"interlinea" tra le voci di menu aumenta fino a fuoriuscire dal box che lo contiene. (e ho provato a controllare l'altezza con height ma IE ignora, Mozilla aumenta il margine sinistro... insomma ho ancora meno controllo...).
Ho pubblicato la pagina che sto sviluppando qui, per avere un'idea:
pagina iniziale
Il tuo consiglio di lasciare il testo "all'italiana" è preziosissimo,per fare le cose "a regola" (per quanto ne sono in grado) avrei sbagliato!

[koal]

Ho preso come riferimento per la costruzione della lista questo esempio: maxdesign, listamatic
e qui riporta la larghezza riferita all'ancora: anche qui, se modifico qualcosa (ad es sposto la larghezza in li o ul), ho i problemi che ho riscontrato nello sviluppo del mio sito...

E' un problema che ho sempre avuto, con le liste, e stavolta non ho nemmeno testato su IE 5.5 e Opera (immagino la tragedia quando avrò il coraggio di visualizzare la pagina!)

[Marcolino's]

Le pagine vanno provate per forza, è inutile appellarsi al senso tragico.

Segui questo:
http://www.constile.org/template/menu_verticali/

che mi pare molto meglio in fatto di codice.