Problema con box model

[RGB1]

Ciao ho creato un div contenente un elenco puntato reso float per fungere da menu orizontale.
In IE7 tutto ok mentre in Firefox 2.0 noto che le voci del menu, quando vanno a capo, escono dal div.
Infatti il div ha un bordo inferiore di 1 px e nelle immagini che allego si nota questo effetto.
Come faccio a fare in modo che il div contenga completamente il menu?
Grazie

Qui sotto il codice html e css

 
<div class="elencoSottomenu"><ul>[*]&bull; Qualità dei servizi[*]&bull; Gestione fiduciaria e amministrativa
<li class="sottomenuLinked">Consulenza contabile[*]&bull; Consulenza societaria[*]&bull; Consulenza fiscale[*]&bull; Servizi di family office[/list]</div>

Il css che lo gestisce è questo

.elencoSottomenu{
	clear:both;
	margin:0px 10px 20px 10px;
	padding:0px 0px 20px 0px;
	border-bottom:1px solid #FB993F
}

.elencoSottomenu ul{
	margin-left:10px;
	padding-left:0px;
	padding-bottom:0px;
	margin-bottom:0px;
	margin-top:2px;

}

.elencoSottomenu li {
	float:left;
	list-style-type:none;
	margin-left:0px;
	margin-right:10px;
	padding-left:0px;
	white-space: nowrap;
	color:#FB993F;

}

.elencoSottomenu a{
	color:#FB993F;
	text-decoration:underline;
}

.sottomenuLinked{
	color:#FB993F;
	font-weight:bold;
	font-size:14px
}

[Mich_]

Credo che ti manchi il clear.
Prova ad appllicare la tecnica presentata in [Pillola] FabClearing, un metodo crossbrowser alternativo per il clearing dei float al blocco <ul>.

Personalmente farei un blocco unico del <div> e dell'<ul>, in modo da limitare il numero dei blocchi.

[RGB1]

In effetti era come dicevi tu. Ho applicato il clear di Fab e funziona.
Grazie!