如何修复轮廓并不总是在顶部

Question

目前，我正在尝试创建一组<a>看起来像按钮的内联标签。这些按钮的样式总是在它们周围有一个边框，但我必须设置margin-left: -1px以确保边框像表格一样“折叠”。

除了按钮具有时，一切都有效，:focus因为我想在<a>. 如下图所示，除了隐藏的右侧边缘外，轮廓是完美的。

我正在尝试创建一个漂亮的样式分页控件。按钮布局如下：

<ul>
    <li><a href="#">1</a></li>
    <li><a href="#">2</a></li>
    ...
</ul>

有谁知道为什么会发生这种情况以及我该如何补救？

注意：我可以提供的代码数量有限，因为它是生产代码。我将尝试提供人们临时需要的尽可能多的信息。

Answer 1

这个问题可以通过使用z-indexHTML 元素的CSS 属性来解决。

在这种特殊情况下，使用z-index: 1and position: relativeona:focus将给出正确的显示。

感谢@FabrizioCalderan 的最终答案。