text-align 属性在 chrome 下的一个 bug 产生的原因

<style>
  div {
    width:100%;
    text-align:center;
  }
  ul {
    display:inline-block;
    min-width:800px;
    margin:0 auto;
  }
  li {
    float:left;
    height:30px;
    width: 200px;
    margin-left:1px;
    margin-bottom:1px;
    list-style-type: none;
    background-color: lightblue;
  }
</style>
<div>
<ul>
  <li>1</li>
</ul>
<ul>
  <li>2</li>
</ul>
</div>

样式同样恢复正常。我找了下原因，我认为是因为外层 div 的 text-align 属性起了作用，当 text-align 为 center 或者 right 时，就会出现这个现象，为 left 时正常。大家分析下出现 bug 的原因在哪儿呢？