css:

ul#navlist
{
padding: 0;
margin: 0;
list-style-type: none;
}

ul#navlist li { display: inline; }

ul#navlist li a
{
float: left;
width: 5em;
}

html:

<ul id="navlist">
<li style="border: 1px solid red;"><a href="#">Item one</a></li>
<li style="border: 1px solid red;"><a href="#">Item two</a></li>
<li style="border: 1px solid red;"><a href="#">Item three</a></li>
</ul>

screenshot:

http://img332.imageshack.us/my.php?image=screenshotfirefoxod8.png

doubt:

LI's borders go to the right of the first 'a' element. this is a strange behaviour for me. is there any doc explainin' this? thank you