当我修复我的菜单时，它切入了我的 header 图片

Question

我正在尝试将我的菜单固定到我网站的顶部（我已经弄清楚了），但是当我这样做时，它开始重叠到我的 header 图片中，但它没有看起来真好。我一直在玩不同的修复程序，但似乎无法破解它。

这是我添加的 CSS，它被切入 header。我已经能够将菜单向上移动，因此它不会与图片重叠，但它看起来真的很奇怪，因为文本基本上位于屏幕的最顶部，所以我撤消了它。

@media only screen and (min-width: 768px) {
    .site-top {
        position: fixed;
        width: 100%;
        z-index: 1;
        top: 0;
    }
}

这里有一些图片，所以你可以看到我所看到的。 这是它通常的样子： without the added css

这是新代码的样子： with the added css

感谢您提供的任何帮助。

编辑添加：这是一个 Wordpress.com 站点，我只能在其中添加自定义 CSS 并且无法访问整个代码，所以我不知道如何显示代码header 和菜单。我的网站是 mathbythemountain.com

Answer 1

在您修复它之前，它在 DOM 中占用了 space。添加 position: fixed 后，它变成绝对定位，并且对于文档正常流中的每个其他元素，它都不存在。您需要向正文或顶部元素添加上边距或填充，以使其看起来再次相同。