导航栏链接的填充区域无法点击

Question

我创建了一个导航栏，我无法弄清楚如何使链接的填充区域像链接一样可点击。

我在CSS的这一部分配置了填充..

.spectator_nav li {
    position: relative;
    float: left;
    list-style-type: none;
    padding: 25px 20px;
}

我创造了一个小提琴。我看起来不像这样，但它足以显示悬停效果以及链接的填充区域如何无法点击进入链接。

如何使填充区域可以点击以转到链接？

https://jsfiddle.net/mykx37n9/

Answer 1

您只需将填充添加到<li>

中的链接即可

<强>尝试：

.spectator_nav li {
    position: relative;
    float: left;
    list-style-type: none;
}
.spectator_nav li a{
    padding: 25px 20px;
}