Android浏览器上列出项目后的行

Question

我遇到了下拉菜单的问题，其中下拉的菜单在每个列表项后面都有一个错误的行。它们似乎不是我添加的任何样式，我已经尝试删除我能想到的可能导致它的所有内容。下图中的线条看起来很稳固，但您可以看到第一个线条不像其他线条那样暗。当放大列表时，一些线完全消失，这让我觉得它是某种安卓漏洞？

导航本身的结构如下：

<nav>
    <ul>
        <li id="nav-button">
            <div id="nav-click" class="closed"><span>Menu</span></div>
            <ul class="sub-nav">
                <li><a href="#">Link1</a></li>
                <li><a href="#">Link2</a></li>
                <li><a href="#">Link3</a></li>
                <li><a href="#">Link4</a></li>
            </ul>
        </li>
    </ul>
</nav>

设置的样式除了在Android上都很有效。 .sub-nav的css就是这个。菜单的其余部分有更多的样式，但是我把它们排除了，因为只有这个子列表给了我一个问题。

.sub-nav li {
    float: left;
    width: 100%;
    text-align: center;
    border: none;
    padding: 0;
    margin: 0;
    display: block;
}

Answer 1

从<a>元素中删除背景并将背景添加到<ul>元素，而<a>元素之间似乎存在一些奇怪的子像素间隙。