html - css header 不显示在菜单上方

Question

我的标题有这个 CSS:

在标题下方我有一个水平菜单

.header {
    height:180px;
    margin-top:0;
    border-top:5px #999999 solid;
    background:#FFFFFF;
    position:fixed;
    z-index:-9999;
}

HTML 中的图像未显示 - 我认为它在菜单后面，但我无法将其放在菜单上方:

我创建了一个 jsFiddle，因此您也可以看到完整的 HTML 和菜单 CSS:http://jsfiddle.net/ar9P6/

Answer 1

由于您的页眉位置固定，因此它会脱离文档流。因此，它不再“向下推”导航，导航将出现在它的顶部，如您所见。

我建议您将导航栏向下推与页眉高度相同的像素数。像这样:

.vertical-nav {
   margin-top: 180px;
}

这是您更新的 fiddle :http://jsfiddle.net/ar9P6/9/