What is the wrong with this code? [ placing text under image]

[samvb]

Hi,

I have this code:

CSS:

.onlineuserscon {width:98%; float:left; background-color:#fff;}
.onlineusersul {list-style:none; margin:0; padding:0;}
.onlineuserimg {width:150px; padding:7px; float:left; margin:0;}
.onlineuserli {display:inline ; margin:0; padding:0;}

HTML:

<div class="onlineus erscon">
<ul class="onlineus ersul">
<li class="onlineus erli">
<img class="onlineus erimg" src="picz/none.jpg" />
</li>
<li class="onlineus erli">
<img class="onlineus erimg" src="picz/none.jpg" />
</li>
<li class="onlineus erli">

<img class="onlineus erimg" src="picz/none.jpg" />
</li>

<li class="onlineus erli">

<img class="onlineus erimg" src="picz/none.jpg" />
</li>

</ul>
</div>

*************** *************** *****

It works fine..placing 3 images next to eachother smoothly. But i wanna put text under each image [ name of the person], such as this:

<img...>Dave

If i do this, the page becomes so weird and scattered. What should i do? What is missing?

[drhowarddrfine]

<style>
ul{list-style-type:none}
li{display:block;float:left}
li p {text-align:center}
</style>
<div class="onlineuserscon">
<ul class="onlineusersul">

<li class="onlineuserli">
<img class="onlineuserimg" src="1.jpg" />
<p>Dave</p>
</li>
<li class="onlineuserli">
<img class="onlineuserimg" src="1.jpg" />
Dave
</li>

</ul>

[samvb]

thanks a lot, buddy! u saved my day!