html - 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 中，右边框不显示:

图片:i.imgur.com/OycFyOk.png

FF 和 Safari 工作正常。

fiddle 中的示例代码:

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

Answer 1

你需要把display: block;到“a”元素:

a { display: block; }