-1

我的 css 表适用于 safari 和 mozilla，但不适用于 IE。导航栏 div 层似乎存在特定问题...它是作为水平菜单栏构建的，但在 IE 上显示为垂直菜单栏，并将我的 Flash 横幅推到一边。

有关如何解决此问题的任何提示？

CSS提取如下

/* Menu */

#menu {
width: 1000px;
height: 46px;
margin: 0 auto;
padding: 0;
background: url(images/img04.jpg) no-repeat left top;
}
#menu ul {
margin: 0;
padding: 0px 0px 0px 48px;
list-style: none;
line-height: normal;
}

#menu li {
position: relative;
float: left;
list-style: none;
margin: 0;
padding:0;
}


#menu a {
display: block;
height: 32px;
margin-right: 3px;
padding: 14px 30px 0px 30px;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: normal;
color: #FF9900;
border: none;
}
#menu a:hover, #menu .current_page_item a {
background: #C44203;
}

#menu .current_page_item a {
background: #C44203;
}

#menu a:hover {
background: #C44203;
text-decoration: none;
}

#menu li a{
display: inline-block;
height: 32px;
margin-right: 3px;
padding: 14px 30px 0px 30px;
text-decoration: none;
text-align: center;
line-height: 25px;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: normal;
color: #FF9900;
border: none;
}
#menu li a:hover{
background-color: #C44203;  
}   
#menu ul ul{
display: block;
height: 60px;
margin-left:-96px;
left: 50%;
position: absolute;
top: 45px;
visibility: hidden;
}

#menu ul li:hover ul{
visibility: visible;
}

非常非常感谢薇薇安

4

3 回答 3

1

试试这个链接...

http://robertnyman.com/2010/02/24/css-display-inline-block-why-it-rocks-and-why-it-sucks/

听起来display: inline-block;只适用于 IE8 及更高版本。但是该链接为您提供了一个解决方案，并解释了使用它的好处和回退。

于 2012-06-21T09:37:02.773 回答
1

删除 position: relative；来自#menu li。它将在 IE 中工作。

于 2012-06-21T09:46:25.453 回答
0

visibility: visible;进入_display:block;

并visibility:hidden;进入Display:none;

像这样

#menu ul ul{
display:none;
}

#menu ul li:hover ul{
display:block;
}
于 2012-06-21T09:37:14.190 回答