html - 超链接在导航栏上不起作用 - 不可点击

Question

我的链接在我的导航栏上不起作用。我无法弄清楚我做错了什么。这是代码。 HTML:

<div id="menu"
<ul>
    <li><a href="http://kerryaltmantest.info">Home</a></li>
    <li><a href="http://kerryaltmantest.info/aboutme.html">About Me</a></li>
    <li><a href="publications">Publications</a></li>
    <li><a href="location">Location</a></li>
    <li><a href="strategicinteractions">Strategic Interactions</a></li>
</ul>

和 CSS:

#menu {
    width: 950px;
    height: 35px;
    font-size: 20px;
    font-family: cambria, Georgia, sans-serif;
    font-weight: bold;
    text-align: center;
    background-color: #FFF;
    border-radius: 0px;
margin-top: -175px;
margin-left: 25px;
}

#menu li {
    display: inline;
    padding: 20px;
}

#menu a {
    text-decoration: none;
    color: #2B297F;
    padding: 8px 8px 8px 8px;
}

#menu a:hover {
    color: #2B297F;
    background-color: #999;
}

我确定这正是我所缺少的。如果您想查看站点本身以了解其含义，可以在 http://kerryaltmantest.info 找到它。

谢谢!

Answer 1

看起来您的一个 div 位于您的导航栏前面。通过仔细调查，我发现 div .mainrunner 与导航栏重叠......(红色边框)

如果您尝试将它从您的 css 中删除，您会看到您的导航现在可以点击了......耶!

如果有其他问题，请告诉我!