超链接无法在导航栏上工作 - 无法点击

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 会覆盖您的菜单

我在这里添加了工作小提琴

Click on Home in Fiddle

Working Demo 也可以在索引页面使用此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;
}

Answer 2

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

如果您尝试将其从css中移除，您会看到您的导航现在可以点击... YAY！

如果有任何其他问题，请告诉我！