2014-05-17 27 views
0

我第一次只想添加自定义菜单到我的WordPress的网站..!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/

,所以如果你的人能帮助请至确定是什么导致这个空白区域出现以及如何删除那个..?

等待您的回复...!

+0

既然你实现了我的答案,你也可以接受它;) – Fonzy

回答

0

编辑:

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

地址:#primaryNav {float:left};

对我的作品!

+0

肯定..但现在就像我删除浮动:左;所以菜单从垂直变为水平,那么该怎么办? –

+0

更新了原始答案 – Fonzy