CSS 位置固定不工作

Question

每次向下滚动时，我制作的导航栏也会向下移动。当我调整窗口大小时(更小/更大)，即使我使用了 position:fixed，它仍然会移动。

我做错了什么？

nav li:nth-child(1) {
  position: fixed;
  border: 1px solid #15317E;
  font-size: 30px;
  list-style-type: none;
  font-weight: bold;
  text-transform: uppercase;
  padding: 10px 10px 10px 10px;
  width: 184px;
  background-color: #15317E;
  top: 20px;
  left: 220px;
}
a:link,
a:visited {
  text-decoration: none;
  color: white;
  margin-bottom: 1px;
}
a:hover,
a:active {
  color: white;
  background-color: #1569C7;
  width: 1000px;
}

<nav>
  <li><a href="Team.html" title="Team">The Team</a></li>
  <li><a href="#Info">Information</a></li>
  <li><a href="#div">Community</a></li>
</nav>

Answer 1

固定位置是指浏览器窗口。使用这个位置的元素总是可见的。我认为你想要的位置是“绝对的”。 JSFiddle

nav li:nth-child(1) {
  position: absolute;
}