所以我有一个有7个元素的无序列表,它们显示为内联,并且在li里面有空的 anchor 标签(我真的需要它们为空和 anchor 标签)。
这是一个链接http://jsfiddle.net/FTHMf/2/。
Chrome仅显示其中的6个,我不知道为什么,Firefox似乎只能显示全部7个。
另外,出于各种原因,我也不想使用内联块。
有没有什么办法解决这一问题?是什么原因引起的问题?
谢谢!
HTML
<ul class="john">
<li><a href="#"></a></li>
<li><a href="#"></a></li>
<li><a href="#"></a></li>
<li><a href="#"></a></li>
<li><a href="#"></a></li>
<li><a href="#"></a></li>
<li><a href="#"></a></li>
</ul>
CSS
.john {
width:100%;
text-align:center;
}
.john li {
display:inline;
}
.john li a {
background-color:green;
line-height:0px;
font-size:0px;
padding:6px;
margin:0px 2px 0px 2px;
}
最佳答案
Chrome出于任何原因均未显示第一个元素。这是一个不会以任何方式影响您的HTML/布局的方法,但是使我难过为什么会发生-最肯定是一个错误。
.john li:first-child a:after { position: absolute; content: ""; }
http://jsfiddle.net/chrisdanek/xW2e2/