CSS - 列表边框没有显示

Question

html：

<li>
    <a href="">text<span></span></a>
</li>

css：

ul{
    list-style:none
}
li{
  float: left  
}
a{
    padding: 10px;
    border: 1px solid #000;
}

在chrome中，右边框不会显示：

image：i.imgur.com/OycFyOk.png

FF和Safari工作正常。

小提琴中的示例代码：

http://fiddle.jshell.net/yrntrapk/

Answer 1

你需要把display：block;到＆＃34; a＆＃34;元素：

a { display: block; }

Answer 2

删除HTML上的空span标记应该是最快的解决方法。