Question

我有一个顶级菜单，必须始终可见，所以我使用的位置：固定。它工作，菜单始终在窗口的顶部。问题伴随着内容，下一个带有大图像的div被菜单切断：

#header {
   position: fixed;
   top: 0;
}

您可以在此链接中看到菜单：

http://212.48.86.94/~admin/el-cuartel-gana-el-tercer-premio-mejor-agencia-independiente-en-los-premios-control-2014/

我已经尝试过改变位置，溢出以及萤火虫中的所有东西而没有运气。

我正在修改的wp主题也会对高度进行一些javascript计算并使用on scroll事件。

我不确定如何修复它。

Answer 1

到你的英雄包装器只需添加一个余量..

#hero-wrapper{
    margin-top: 68px;
}

这将抵消固定标题的宽度

其他几点说明......

第2549行有一个console.log（）你应该删除它。

console.log('dentro1');

你的main.js的第2551行在滚动时抛出错误

$categoryHash = document.URL.split('?')[1].replace( /^filter=/, '' );

Uncaught TypeError: Cannot read property 'replace' of undefined

Answer 2

只需将margin-top: 100px或标题的任何值添加到CSS中即可。这将确保您的内容不会被覆盖在页面顶部。你可以尝试这样的事情：

#nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 100px;
  background: blue;
  color: white;
}
.content {
  margin-top: 100px;
  }

<div id="nav">Welcome</div>
<div class="content">bla
  <br>bla
  <br>bla
  <br>bla
  <br>bla
  <br>bla
  <br>bla
  <br>bla
  <br>bla
  <br>bla
  <br>bla
  <br>bla
  <br>bla
  <br>bla
  <br>bla
  <br>bla
  <br>bla
  <br>bla
  <br>bla
  <br>bla
  <br>

我希望这会有所帮助。如果您需要其他帮助，请在下面的评论中告诉我们。

css固定菜单重叠内容

2 个答案: