I am trying to have some LIs within a UL align left, right, and center within a page. For the life of me, I can't figure out how to keep something "centered" on the same line as a left and right aligned LI.

<style>
ul {
    margin:1em 0;
    padding:0
} 

ul li{
    display:inline-block;
    white-space:nowrap; 
    margin:5px
} 

ul li.left{
    float: left; 
    text-align:left; 
} 

ul li.center{
    float:left; 
    text-align: center;
} 

ul li.right{
    float: right; 
    text-align:right; 
} 
</style>


<ul> 
    <li class="left">left</li> 
    <li class="center">center</li> 
    <li class="right">right</li> 
</ul> 

<ul> 
    <li class="left">left</li> 
    <li class="right">right</li> 
</ul> 

<ul> 
    <li class="left">left</li> 
</ul> 

Can anyone help? BTW, I've trying to avoid DIVs.

Thanks!