在这一节中，为何我为div加入了边框属性后原本水平居中的ul项目突然移动位置变成在浏览器的左方？
在这一节中，为何我为div加入了边框属性后原本水平居中的ul项目突然移动位置变成在浏览器的左方？
-------------------------------------------
.container{
float:left;
position:relative;
left:50%
border:3px solid green;
}
.container ul{
list-style:none;
margin:0;
padding:0;
position:relative;
left:-50%;
}
.container li{
float:left;
display:inline;
margin-right:8px;
}
-----------------------------
<div class="container">
<ul>
<li><a href="#">1hgggggggggggggggg</a></li>
<li><a href="#">2hhhhhhhhhhhhhhhhhhhh</a></li>
<li><a href="#">3hhhhhhhhhhhhhhhhhhh</a></li>
</ul>
</div>
