Salve,

ho realizzato un menu orizzontale i cui elementi sono inseriti in una unordered list.
Quando riduco la dimensione della pagina gli ultimi elementi sulla destra vengono spostati sotto il menu creando di fatto due righe.

Questo va bene, ma l'unico problema è che il div principale del menu non si estende a contenerli, quindi il background è visibile solo per la prima riga.

Cosa devo modificare in modo tale che il menu si estenda se gli elementi vengono spostati su una seconda riga?

Grazie

Ecco il codice:
codice:
.headerMenu
{
/*Questa e' l'altezza ottimale per una riga. Anche settando "auto" il problema permane*/
height:26px; 
overflow:visible;
min-width:980px; 
background-color: #464646; 
}

.headerMenu ul{	height:22px; }
.headerMenu ul li a
{	
line-height: 22px; 
padding: 2px 15px;      
color:Silver;	
float: left;
display:block;
padding: 2px 10px;
}

.headerMenu ul li a:hover , .headerMenuSelected a{     
color: #464646 !important;		
background: #E4F2FD none !important;
}

.headerMenuSelected a
{
	padding-top: 8px !important;	
	margin-top: -6px !important;	
	position:relative;
	z-index:20;
}


<div class="headerMenu">
  <ul>[*]
        Home
     [/list]

....

</div>