html - div 高度为 100%，但顶部和/或底部仍有空间

Question

我正在尝试制作一个侧边导航栏，它有一个 position: fixed 和一个 height: 100%，但是当我尝试这个时，总是还有空间您可以在 div 下方和上方看到背景。顺便说一下，我也尝试将 height 设置为 1000px 但我仍然遇到同样的问题。

HTML:

<div id='navbar'></div>

CSS:

#navbar {
  background-color:black;
  width:100px;
  height:100%;
  z-index:99;
  position:fixed;
  left:-10px;
  bottom:10px;
}

JSFiddle

Answer 1

我猜你正在设置 bottom: 10px 以将你的 #navbar 推到你在 10px 间距处的顶部第一名，这导致底部有相同的间距。您可以通过应用 top: 0; 强制您的元素从其父高度的开始/结束延伸； bottom: 0;(你应该删除 bottom: 10px;)到 #navbar 元素。

附言top: 0 是多余的，但我设置它是为了演示这个概念。

JSFiddle