无法单击 Wordpress 导航栏上的主页按钮答案

【问题标题】：Cannot Click Home Button On Navigation Bar In Wordpress无法单击 Wordpress 导航栏上的主页按钮
【发布时间】：2016-02-01 19:17:08
【问题描述】：

当我在自定义 wordpress 主题中单击导航栏上的主页按钮时，无法给出任何响应，例如打开主页。请在此链接上查看my own theme 以获取更多信息。它的主页按钮截图如下：

此处导航栏的 css 样式：

 .navbar-header {
    position: relative;
}

.navbar-brand {
    float: left;
    padding: 15px 15px;
    font-size: 18px;
    line-height: 20px;
    height: 50px;
}

我一直在尝试修复它，但仍然没有运气

【问题讨论】：

标签： css wordpress wordpress-theming

【解决方案1】：

问题在于 div "navbar-collapse" 是全宽的并且位于按钮的顶部。因此，当您尝试点击按钮时，您实际上点击了“navbar-collapse”。

为了快速修复，您可以：

给“navbar-collapse”一个宽度并将其设置为“margin: 0 auto;”。然后它将不再覆盖您的按钮。

或

增加 "navbar-header" 的 z-index --> z-index 21 适合你的情况

【讨论】：

【解决方案2】：

CSS

.navbar-header {
  /* your own styles */
  z-index:9999;
}

.collapse .navbar-collapse 中的 li 位于您的导航栏上。您正在单击该部分而不是标题。使用z-index，您可以将标题带回顶部。

【讨论】：

【解决方案3】：

<div class="collapse navbar-collapse"> 已经有 z-index:20。所以它会覆盖你的主导航栏。

使用下面的css

.navbar-header {
    z-index: 21;
}

【讨论】：

【解决方案4】：

改变你的 css .. 因为它的宽度是 100% 并且它与 Home 按钮重叠.. Line no 246 in style.css

.navbar-default .navbar-collapse, .navbar-default .navbar-form{
    width: 80%;
    margin: 0px auto;}

【讨论】：