Chrome中未对齐的第一个子列表项（Mac / Windows）

Question

JSFiddle：http://jsfiddle.net/UXA5Q/

我有以下HTML代码：

      <ul class="advisorlist">
           <li>                     
              <div class="employee">
                   <address>
                       <a title="E-mail John Doe" href="http://www.example.com/employee.html" rel="nofollow" class="email"><strong>John Doe</strong></a>
                       <br><em>Academic Advisor</em>
                      <br>Phone: 540-351-5555                           
                      <br>Fax: 540-351-5555                             
                   </address>                                           
               </div>                                          
            </li>                                      
            <!-- etc -->
       </ul>

以下CSS代码：

ul.advisorlist {
    clear:both;
    list-style: none;
}
ul.advisorlist li {
    float: left;
    padding: 0;
    margin: 10px 10px 0 10px;
    width: 140px;
    min-height: 200px;
    height: auto !important;
    height: 200px;
}

列表中的第一项在Mac / Windows上的Chrome中未对齐。 Chromium，FF，Safari，IE等正确显示所有列表项。

有什么想法吗？

Answer 1

尝试删除clear:both;上的ul.advisorlist。

<强> jsFiddle example

Answer 2

clear: both表示任何浮动元素都不会与任何一侧的早期浮动框相邻。

  

clear属性指示元素框的哪些边可能与先前的浮动框不相邻。

http://www.w3.org/wiki/CSS/Properties/clear

关于clear的更详细信息：http://www.w3.org/TR/CSS2/visuren.html#flow-control

删除它，你看起来很好。

另外，你有一堆css并没有做太多！看看我放在一起的jsFiddle fork。

Answer 3

。删除清除：两者都来自li的父级并添加溢出：隐藏到ul

Answer 4

li {
list-style-position: inside;
}

为我工作。谢谢大家的努力！