Buongiorno,

Credo di essermi impatatraccata con una cosa stupida, se poteste aiutarmi... Questo è il codice:

codice:
<div id="sezioni">
  <ul class="paesi">[*]Notizia 1				[*]Notizia 2[*]...    [*]Notizia 1000[/list]
   <ul class="ambienti">[*]HOME PAGE[*]Categoria 1[*]Categoria 2[*]Categoria ...[*]Categoria 1000		[/list]
</div>
Questo il css specifico:
codice:
#sezioni {padding: 1em 0 1em 0; margin: 0; text-align: left; font-size: 11px;}
#sezioni ul {text-align: center; margin: 0; padding: 0 0 10px 0  !important; padding: 0 0 5px 0;}
#sezioni ul li {display: inline; width: 20px; padding: 0; margin: 0;}
#sezioni a {text-decoration: none;}

.paesi li {height: 10px; display: inline;}
.paesi li a { display: inline; color: #ab2b08; padding: 3px; margin: 0 0 3px 0;}
.paesi li a:hover {color: #FFFFFF; background: #ab2b08;}

.ambienti  {position: absolute; background: #ab2b08; height: 7px; border-top: 4px solid  #ab2b08; width: 973px;}
.ambienti li a {color: #FFFFFF; font-weight: bold; padding: 10px 5px 5px 5px; margin: 0; height: 10px;}
.ambienti li a:hover {color: #ab2b08; background: #FFFFFF; height: 10px;}
Il problema è che con alcuni browser (tipo firefox) tutti i nomi di sezione con più di un termine, ad esempio Categoria 1000, rimane scritta sulla stesso rigo, mente con Internet Explorer il 1000 va a capo (mi son spiegata bene o devo fare uno screenshot?)

Come vedete ai .paesi ho aggiunto *height: 10px; display: inline;* ma non aiuta. Io di solito tento di rimanere autonoma ma adesso non so che combinare. Un aiutino magari!! Grazie!!!