CSS页面上下间距问题求助：固定导航后main容器出现间隙

• 先清除全局默认边距，浏览器对html和body的默认样式是常见的间隙来源：

  html, body {
    margin: 0;
    padding: 0;
  }
  

• 由于nav设为position:fixed后脱离文档流，main容器会自动填充原nav的位置，再加上main自身可能带默认margin，就会出现上下间隙。直接清除main的默认边距，并给顶部设置与nav高度一致的内边距（避免页面内容被fixed的nav遮挡）：

  main {
    margin: 0; /* 清除上下默认边距 */
    padding-top: 60px; /* 替换成你实际的nav高度 */
    padding-bottom: 0;
  }
  

• 检查nav的定位属性，确保它完全贴住顶部，避免视觉上的顶部间隙：

  nav {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    /* 其他自定义样式 */
  }
  

• 用浏览器开发者工具（F12）选中main元素，查看盒模型里的margin、padding数值，确认是否有其他隐藏样式导致间隙。

内容的提问来源于stack exchange，提问作者wonderful