我的标题CSS＆amp;遇到问题jQuery的

Question

嘿，我在http://www.willruppelglass.com/

的标题会遇到一些麻烦

导航是我想要它的地方，但是如果你将鼠标悬停在画廊上，则子菜单可以向右移动...我试图向右侧稍微移动一下。填充和边距不起作用：（

这是我的CSS：

.headerNav{
    color:#FFF;
    padding-left: 150px;
    padding-top: 148px;
}

.headerNav ul{
    list-style-type:none;
    margin:0;
    padding:0 0 0 8px;
}

.headerNav li{
    float:left;
}

.headerNav ul a{
    font-size:24px;
    color:#FFF;
    display:block;
    padding:0 55px 0 0;
    text-decoration:none;
    text-transform:capitalize;

}

.headerNav ul a:hover{
    color:#a40404;
    text-decoration:none;
}

.headerNavGallery{
    color:#000;
    padding-top:30px;
    padding-left:250px;
}

.headerNavGallery ul{
    list-style-type:none;
    margin:0;
    padding:0 0 0 8px;
}

.headerNavGallery li{
    float:left;
}

.headerNavGallery ul a{
    font-size:24px;
    color:#000;
    display:block;
    padding:0 15px 0 0;
    text-decoration:none;
    text-transform:capitalize;

}

.headerNavGallery ul a:hover{
    color:#a40404;
    text-decoration:none;
}

我的Jquery：

    $(".galleryNavToggle").on("mouseenter mouseleave", function(event){
    var headNavGal = $("#headerNavGallery");
    if(event.type === "mouseenter"){
      headNavGal.show();
    }else if(event.type ==="mouseleave" &&
             ((event.relatedTarget !== headNavGal[0] && $.inArray(event.relatedTarget, headNavGal.find("*")) <=0) ||
             $.inArray(event.relatedTarget, $(".galleryNavInfoToggle")) > 0)){
        headNavGal.hide();
    }
});
$("#headerNavGallery").on("mouseleave", function(event){
    var headNavGal = $(this);
    if(event.type ==="mouseleave"){
        headNavGal.hide();
    }
});

和我的HTML：

<div class="headerNav">
<ul>
<li><a href="index.php?action=view">Home</a></li>
<li><a href="#" class='galleryNavToggle'>Gallery</a></li>
<li><a href="#" class='galleryNavInfoToggle'>Info</a></li>
</ul>
</div><!--headerNav-->




<div class="headerNavGallery" id="headerNavGallery" style="display:none;">
<ul>
<li><a href="#">Categoies</a></li>
<li><a href="#">Products</a></li>
</ul>
</div><!--headerNavGallery-->

谁能告诉我我做错了什么？

Answer 1

您是否尝试为padding: 0设置.headerNav ul a？

Answer 2

我认为您必须将headerNavInfo div移到headerWrapperDiv之外（正好在其下方）并将填充设置为零px

Answer 3

只需在style.css中更改padding-left

第98行

.headerNavGallery {
  padding-left: 285px ;
}

第129行

.headerNavInfo {
  padding-left: 445px;
}