导航栏无法正常工作?

Nav bar isn't working properly?

所以我正在为学校评估制作一个网站,我想知道为什么我的导航栏链接总是略低于实际导航栏本身。如果有人能提供帮助那就太好了:)。

    ul {
  text-align: center;
  padding-left: 1px;
  top: -10px;
  list-style: none;
}

ul li {
  font-family: Arial;
  font-size: 15px;
  font-weight: bold;
  display: inline-block;
  margin-right: -4px;
  position: 0px;
  padding: 10px 89.5px;
  background-color: #6C2DC7;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  transition: all 0.2s;

}
ul li:hover {
  background:  #8467D7;
  }

a:link {color:#FFFFFF;} /* unvisited link */
a:visited {color:#FFFFFF;} /* visited link */
a:hover {color:#FFFFFF;} /* mouse over link */
a:active {color:#FFFFFF;}  /* selected link */
a {
text-decoration: none;
}

This is what it looks like on my website.

如果您更改它,它将起作用:

您的 style.css

的第 75 行
ul {
    text-align: center;
    top: 0px;
    list-style: none;
    margin-top: -5px;
}

真的,你应该只为你的导航栏而不是每个 ul 做这个,所以你可以将其更改为以下内容:由你决定,尽管这两种方式都有效:)

 #navigation ul {
        text-align: center;
        top: 0px;
        list-style: none;
        margin-top: -5px;
    }