【问题标题】:Overlapping elements重叠元素
【发布时间】:2014-04-08 06:01:59
【问题描述】:

在此站点http://nutritiousinfo.com 上,我试图让菜单导航元素与标题重叠。我尝试将菜单的上边距更改为 -35px,它看起来很好,直到我刷新它并再次跳回。这是我的标题和菜单部分的 CSS:

#header {
    background: url(http://nutritiousinfo.com/wp-content/uploads/2014/04/Header.png);
    width: 960px; 
    height: 120px;
    margin: 10px auto 0;
    -moz-box-shadow: 0 0 0px #BBBBBB; 
    -webkit-box-shadow: 0 0 0px #BBBBBB;
    z-index: -1;
    }



#subnav .wrap {
    background: url(http://nutritiousinfo.com/wp-content/uploads/2014/04/NewNav.png);
    width: 960px;
    height: 70px;
    margin: -30px auto 0;
    clear: both;
    overflow: hidden;
    border-top: 0px solid #111111;
    -moz-box-shadow: 0 0 0px #BBBBBB; 
    -webkit-box-shadow: 0 0 0px #BBBBBB;
    z-index: 999999;
    }

【问题讨论】:

  • 尝试在 jsfiddle 中做一个最小的测试用例。
  • 对不起-我不确定你的意思..我对这一切有点新手:-(
  • 你有一堆代码。尝试在jsfiddle.net 中制作一个更简单的示例
  • 喜欢这个?我认为这是我需要修复的这两点?
  • 这更好,但 jsfiddle 仍然会有所帮助。

标签: css overlap


【解决方案1】:

尝试用这个替换你的实际边距:

#subnav .wrap {
   margin: -35px auto 0px auto;
}

#subnav ul {
   width: 100%;
   float: left;
   list-style: none;
   margin: 0 !important;
   padding: 0 !important;
}

ul {
   margin: 0;
   padding: 0;
}

【讨论】:

  • 谢谢 - 试过了,但没有改变。奇怪的是,如果我查看“检查元素”,它会跳起来并且看起来正确。然后当我刷新时它又跳回了。
  • 我还看到您没有重置 css,因为存在用户代理样式...
  • 您是否尝试过使用 css 重置?尝试从答案中添加新行,因为用户代理样式仍然存在。
猜你喜欢
  • 2012-12-07
  • 2012-08-14
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多