菜單上添加寬度否則NAV UL在拐角

以下是菜單項從杆 http://jsfiddle.net/bej85/菜單上添加寬度否則NAV UL在拐角

的角出現的CSS和我編輯的CSS和在加入

width:19em;

#nav ul部分的CSS和菜單項目居中。

http://jsfiddle.net/bej85/1/

我不像爲什麼將邊緣非常清晰帶來了菜單項，中心，我是新來的CSS類的話和HTML，所以我想知道這種行爲。

以下是代碼

<!DOCTYPE html> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 
<title>Jenware | Personalized Gifts</title> 
<style type="text/css"> 


/* styles for navigation */ 
#nav { 
    background-color: #2322ff; 
    height: 3em; 


} 
#nav ul { 
    list-style:none; 
    margin:0 auto; 
    padding: 0; 


} 
#nav ul li { 
    font-weight: normal; 
     text-transform: uppercase; 
    float:left;  

} 

#nav ul li a {  
    display: block; 
    padding: .5em;  
    border: 1px solid #ba89a8; 
    border-radius: .5em; 
    margin: .25em; 

} 

</style> 
</head> 
<body> 
<div id="nav"> 
<ul> 
<li><a href="">House</a></li> 
<li><a href="">Baby</a></li> 
<li><a href="">More</a></li> 
<li><a href="">About</a></li> 
</ul> 
</div> 

<!-- end #content --> 
</body> 
</html>

，這裏是當寬它如何出現：19em是在導航UL部分 menu at centre