0
我在wordpress中創建了一個自定義菜單。該菜單含有孩子的頁面。我的下拉菜單在IE中不起作用
下拉菜單在firefox和chrome中可用,但在IE中不起作用。
這是我的CSS代碼。
/* =Menu
-------------------------------------------------------------- */
#access {
clear: both;
display: block;
float: left;
margin: 0 auto 6px;
width: 100%;
}
#access ul {
list-style-type: none;
margin: 0;
padding: 0;
z-index: 9999 !important;
}
#access li {
display: inline;
float: left;
position: relative;
z-index: 9999 !important;
}
.menu .menu-item:hover {
background:#89ab20;
}
#access a {
color:white;
padding-right: 24px;
text-decoration: none;
}
#access ul ul {
-moz-box-shadow: 0 3px 3px rgba(0,0,0,0.2);
-webkit-box-shadow: 0 3px 3px rgba(0,0,0,0.2);
box-shadow: 0 3px 3px rgba(0,0,0,0.2);
display: none;
float: left;
margin: 0;
position: absolute;
top: 2.8em;
left: 0;
width: 188px;
z-index: 99999;
background-color:#89ab20;
}
#access ul li ul li {
border-bottom: 1px solid white;
display: list-item;
float: none;
}
#access ul li ul li a:hover {
background-color:#0086b2;
}
#access ul ul ul {
left: 100%;
top: 0;
}
.sub-menu {
background-color:#89ab20;
}
.sub-menu .menu-item:hover {
background-color:#0086b2;
}
#access ul ul a {
font: normal 11px Verdana;
width: 135px; /*width of sub menus*/
padding: 7px 10px 7px 10px;
height:auto;
margin: 0;
border:none;
background-image:none;
border-bottom:#fff solid 1px;
text-decoration:none !important;
border-bottom:none;
display:block;
}
#access li:hover > a,
#access ul ul :hover > a,
#access a:focus {
background-color:#0086b2;
text-decoration:none !important;
}
#access li:hover > a,
#access a:focus {
color:#fff;
background-color:#89ab20;
}
#access ul li:hover > ul {
display: block;
}
#access ul li {
border-right: 1px solid #FFFFFF;
color: white;
display: block;
font-size: 12px;
line-height: 30px;
padding: 0 23px;
text-decoration: none;
}
#access .current-menu-item > a,
#access .current-menu-ancestor > a,
#access .current_page_item > a,
#access .current_page_ancestor > a {
font-weight: bold;
}
.current_page_item {
background-color: #89AB20;
color: #FFFFFF;
}
這裏是我生成的html。請任何能解決我的問題的人。提前致謝。
<div class="navigation">
<nav role="navigation" id="access">
<h3 class="assistive-text">Main menu</h3>
<div class="skip-link"><a title="Skip to primary content" href="#content" class="assistive-text">Skip to primary content</a></div>
<div class="skip-link"><a title="Skip to secondary content" href="#secondary" class="assistive-text">Skip to secondary content</a></div>
<div class="menu-main-menu-container"><ul class="menu" id="menu-main-menu"><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-69 first-child" id="menu-item-69"><a href="">About</a>
<ul class="sub-menu">
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-141 first-child" id="menu-item-141"><a href="">About</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-140" id="menu-item-140"><a href="">About</a></li>
</ul>
</li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-64" id="menu-item-64"><a href="">About</a>
<ul class="sub-menu">
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-67 first-ch
ild" id="menu-item-67"><a href="">About</a>
<ul class="sub-menu">
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-68 first-child" id="menu-item-68"><a href="">About</a></li>
</ul>
</li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-65" id="menu-item-65"><a href="">About</a>
<ul class="sub-menu">
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-66 first-child" id="menu-item-66"><a href="">About</a></li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-230 last-child" id="menu-item-230"><a href="">About</a></li>
</ul>
</li>
</ul>
</li>
</ul></div>
</nav><!-- #access -->
</div>
你通過_it的意思不IE_工作。什麼不行? – elclanrs 2012-02-20 07:45:09
我在wordpress中創建了一個下拉菜單。鼠標懸停在頁面上列出其子。但在IE中,當我通過鼠標在頁面上時,孩子們沒有顯示。我正在談論導航菜單。 – Ahmad 2012-02-20 07:47:34
什麼版本的IE?它發生在IE9中嗎?如果你在[jsFiddle](http://jsfiddle.net)上提供了一個例子,這將是有用的。 – elclanrs 2012-02-20 07:48:23