posizionamento di div all'interno di elenchi

[nextpic]

Ciao a tutti e ben trovati. Ho questo codice html

<ul>
    <li class="dispari">
        <div class="images"></div>
        <div class="title"></div>
        <div class="body"></div>
    
    <li class="pari">
         <div class="images"></div>
         <div class="title"></div> 
         <div class="body"></div>
    [/list]

i "div" all'interno dei "li" mi si posizionano naturalmente uno sotto l'altro io vorrei invece che mi si posizionassero uno a fianco all'altro e per fare ciò ho scritto questo codice css:

ul {
	margin: 0 10px;
	padding: 10px 0;
	list-style: none;
	list-style-image: none;
}

ul li {
	margin-bottom: 10px;
	border: #666 solid 1px;
	padding: 5px;
	clear: left;
}

ul li.dispari {
	background: #CCC;
}

ul li.pari {
	background: #999;
}

ul li div {
	position: relative;
}

ul li div.images {
	width: 110px;
	float: left;
} 

ul li div.title {
	width: 110px;
	float: left;
}

ul li div.body {
	width: 110px;
	float: left;
}

Il problema è che i div mi si posizionano correttamente ma non all'interno dello sfondo dei vari tag "li". Come posso risolvere questo problema?
Grazie a voi tutti

[MaxSimon]

Aggiungi la riga evidenziata qui sotto:

ul li.dispari {
     background: none repeat scroll 0 0 red;
     display: inline-block; 
}

Ciao.