Question

我首先只是想在我的wordpress网站上添加自定义菜单..！

我确实添加了这些但是现在..菜单上面有一些空白区域...我想删除它..但我真的不知道该怎么办？

这是我的菜单代码：

<nav id="primaryNav" section="brandnav" data-endpoint="/component/load/xhr/">
<ul>
 <li class="menu double" id="reviewsMenu" data-component="touchMenuHover">
    <a class="menuHead" data-trigger="menu" href="reviews/index.html">Reviews</a>
  </li>

 <li class="menu double" id="newsMenu" data-component="touchMenuHover">
    <a class="menuHead" data-trigger="menu" href="news/index.html">News</a>
 </li>
 <li class="menu double" id="videoMenu" data-component="touchMenuHover">
    <a class="menuHead" data-trigger="menu" href="videos/index.html">Video</a>
    </li>

 <li class="menu single" id="howtoMenu" data-component="touchMenuHover">
    <a class="menuHead" data-trigger="menu" href="how-to/index.html">How To</a>
 </li>

 <li class="menu" id="download">
    <a class="menuHead" href="http://www.download.com/" data-user-action="legacy">Download</a>
</li>
</ul>
</nav>

菜单的CSS代码是：

li:hover {
height:59px;
}
#primary {
height: 59px;
font-size: 0.94118em;
position: relative;
background-color: #6895d9;
min-width: 980px;
}

#primary .menuWrapper {
font-size: 14px;
position: absolute;
top: 74px;
left: 0;
z-index: 5000000;
box-shadow: 0 3px 8px 3px rgba(0, 0, 0, 0.1);
background-color: #fff;
opacity: 0;
visibility: hidden;
-webkit-transition: opacity 0.2s ease, top 0.2s ease;
-moz-transition: opacity 0.2s ease, top 0.2s ease;
-o-transition: opacity 0.2s ease, top 0.2s ease;
transition: opacity 0.2s ease, top 0.2s ease;
}

#primary .menuWrapper a {
color: #768696;
display: block;
}

#primary .menuWrapper a:hover {
color: #ff8b00;
}

#primary .menuWrapper:after {
position: absolute;
content: "";
display: block;
background: url('http://cnet4.cbsistatic.com/fly/339-fly/bundles/cnetcss/images/sprites/main-s58cd57e9cc.png') 0 -1341px no-repeat;
left: 30px;
padding-top: 0;
top: -5px;
height: 5px;
width: 11px;
}

#primary .single nav {
padding-right: 10px;
float: left;
}

#primary .single nav:after {
background-color: #DBDBDB;
box-shadow: 2px 0 3px -3px rgba(0, 0, 0, 0.4) inset;
content: "";
display: block;
height: 100%;
right: 0;
position: absolute;
top: 0;
width: 10px;
}


#primary .double nav {
overflow: hidden;
}

#primary .double .navWrapper {
background: #DBDBDB;
box-shadow: 2px 0 3px -3px rgba(0, 0, 0, 0.4) inset;
float: left;
left: 180px;
position: relative;
width: 450px;
}

#primary .hed {
text-transform: uppercase;
margin-top: 0;
font-weight: 600;
}

#primaryNav a.menuHead {
color: #fff;
position: relative;
height: 59px;
line-height: 59px;
display: block;
}

#primaryNav .menu {
float: left;
position: relative;
padding: 0 20px;
-webkit-transition: opacity 0.2s ease;
-moz-transition: opacity 0.2s ease;
-o-transition: opacity 0.2s ease;
transition: opacity 0.2s ease;
}

.searchBar {
border-radius: 18px;
position: relative;
}

.searchBar input {
font-size: 16px;
background: none;
border: none;
width: 85%;
margin-left: 15px;
height: 30px;
padding-bottom: 0;
}

.searchBar button {
height: 15px;
width: 14px;
position: absolute;
top: 8px;
right: 15px;
border: none;
background: url('http://cnet4.cbsistatic.com/fly/339-fly/bundles/cnetcss/images/sprites/main-s58cd57e9cc.png') 0 -1158px no-repeat;
 }

.searchBar {
box-shadow: 0 4px 3px -3px rgba(0, 0, 0, 0.25) inset;
background-color: #ECECEC;
border: 1px solid #D9D9D9;
}

和实时网站链接“http://www.huntedhunter.com/teqvibez/

所以如果你们有人可以帮忙请确定导致这个空白区域出现的原因以及如何删除它......？

等待你的回复......！

Answer 1

编辑：

重做：#primaryNav .menu { float:left};

添加：#primaryNav {float:left};

适合我！

Wordpress菜单没有正确显示？

1 个答案: