CSS - 下拉效果不适用于IE-8

时间:2013-12-10 11:57:45

标签: html css internet-explorer

我无法在IE-8上正常运行此代码。我很抱歉,因为我是CSS的初学者。

 <html xmlns="http://www.w3.org/1999/xhtml" xmlns:py="http://purl.org/kid        /ns#">
   <head>
       <meta name="generator" content= "HTML Tidy for Linux/x86 (vers 25 March 2009), see www.w3.org" />
       <meta content="text/html; charset=us-ascii" http-equiv="Content-Type"/>
       <link href="/site_media/css-dock-menu/style.css" rel="stylesheet" type="text/css" />
       <link rel="stylesheet" type="text/css" href="/site_media/css/new.css"/>
   </head>
   </body>
       <ul class="navbar">
         <li style="width:9%;">
            <a href="#">Useful Sites</a>
              <ul>
                  <li><a href="default1.aspx">Portal</a></li>
                  <li><a href="default2.aspx">Calender</a></li>
              </ul>
         </li>
         <li>
          [....] 

基本上悬停在“有用网站”上的应显示下拉列表中有“Portal”和“Calender”。

这是我的new.css -

#wrap   {
        width: 100%; 
        height: 30px;
        margin: 0; 
        z-index: 99; 
        position: relative;
        background-color: #366b82;
        }

.navbar {
        height: 20px;
        padding: 0;
        width: 100%;
        left-margin: 0;
        position: absolute; 
        right: 0;

        }

.navbar li {
                        height: auto;
                        width: 125px;  
                        float: left;  
                        list-style: none;  
            }

.navbar a       {
                padding: 10px 0;  
                border-left: 1px solid #54879d;
                border-right: 1px solid #1f5065; 
                text-decoration: none; 
                color: white; 
                display: block;
                }

.navbar li ul   {
                display: none; 
                height: auto;
                margin: 0;
                padding: 0; 
                }

.navbar li:hover ul     {
                        display: block; /* Displays the drop-down box when the menu item is hovered over */
                        }

提前致谢!

1 个答案:

答案 0 :(得分:1)

您需要如下

.navbar li a:hover ul 
 {
  display: block; /* Displays the drop-down box when the menu item is hovered over */
 }