在IE浏览器上无法正常显示CSS导航栏div层

Question

我的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; 
} 

很多，非常感谢 维维安

Answer 1

尝试此链接...

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

这听起来像display: inline-block;仅适用于IE8及以上。但是链接为您提供了一个解决方案，并解释了使用它的好处和回退。

Answer 2

到visibility: visible;成display:block;

和visibility:hidden;成Display:none;

作为这样

#menu ul ul{ 
display:none; 
} 

#menu ul li:hover ul{ 
display:block; 
} 

Answer 3

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