移动导航偏移且高度未达到 100vh

Question

我试图让我的导航填满整个屏幕（它将隐藏在右角并滑动到中心）但它在左侧有这个奇怪的边距。

还有height: 100vh; 它没有占用 100% 的视图高度。

 @import url("https://fonts.googleapis.com/css2?family=Barlow:wght@400;700&family=Fraunces:opsz,wght@9..144,400;9..144,700&display=swap"); *, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; } header { background-color: aquamarine; height: 3.5rem; padding: 0 1rem; width: 100%; display: flex; justify-content: space-between; align-items: center; }.open-menu, .close-menu { font-size: 2rem; } nav { background-color: bisque; height: 100vh; width: 100vw; position: fixed; }

 <header class="menu"> <h1>Logo</h1> <nav class="nav"> <ul> <li><a href="#" class="links">About</a></li> <li><a href="#" class="links">Services</a></li> <li><a href="#" class="links">Projects</a></li> <li><a href="#" class="links cta">Contact</a></li> </ul> <button class="close-menu"> close </button> </nav> <button class="open-menu"> open </button> </header>

Answer 1

我不确定为什么，但是使用

left: 0;
top: 0;

解决了问题