下拉菜單在IE8中消失

我正在研究一個下拉菜單，它正在IE8中消失。在firefox和chrome中運行正常，但在IE8中運行正常。我GOOGLE了兩天，並做了很多改變，但仍然不能在IE中工作。這是CSS的代碼。下拉菜單在IE8中消失

.dropdownmenu li, .dropdownmenu li ul 
{ 
display: block;display:inline;float:none; 
} 

dropdownmenu ul:hover , .dropdownmenu ul li:hover 
{ 
display: block;display:inline; float:none; 
} 


.dropdownmenu{ 
    border:none; 
    border:0px; 
    margin:0px; 
    padding:0px; 
    font: 37.5% "Lucida Sans Unicode", "Bitstream Vera Sans", "Trebuchet Unicode MS", "Lucida Grande", Verdana, Helvetica, sans-serif; 
    font-size:14px; 
    font-weight:bold; 
    color:#ffffff; 
    } 
.dropdownmenu ul{ 
    background:#333333; 
    height:35px; 
    list-style:none; 
    margin:0; 
    padding:0; 
    } 
    .dropdownmenu li a.top_link span {color:#ffffff;font-size:11px;} 

    .dropdownmenu li{ 
    color: #FFFFFF; 
    font-size:11px; 
     float:left; 
     padding:0px; 
     } 
    .dropdownmenu li a{ 
     background:#333333 url("dropdown/seperator.gif") bottom right no-repeat; 
     color:#ffffff; 
     display:block; 
     font-weight:normal; 
     line-height:35px; 
     margin:0px; 
     padding:0px 11px; 
     text-align:center; 
     text-decoration:none; 
     } 
     .dropdownmenu li a:hover{ 
      background: #2580a2 url("dropdown/hover.gif") bottom center no-repeat; 
      color:#FFFFFF; 
      text-decoration:none; 
      } 
    .dropdownmenu li ul{ 
    color:#ffffff; 
    font-size:10px; 
     background:#333333; 
     display:none; 
     height:auto; 
     padding:0px; 
     margin:0px; 
     border:0px; 
     position:absolute; 
     width:auto; 
     z-index:200; 
     /*top:1em; 
     left:0;*/ 
     } 
    .dropdownmenu li:hover ul{ 
     display:block; 
     float:left; 
     } 
    .dropdownmenu li li { 
     background:url('dropdown/sub_sep.gif') bottom left no-repeat; 
     display:block; 
     float:none; 
     margin:0px; 
     padding:0px; 
     width:auto; 
     } 

    .dropdownmenu li ul a{ 
     display:block; 
     height:35px; 
     font-size:12px; 
     color:#ffffff; 
     font-style:normal; 
     margin:0px; 
     padding:0px 10px 0px 17px; 
     text-align:left; 
     } 

     .dropdownmenu li ulli a:hover{ 
     display:block; 
      background:#2580a2; 
      color:#ffffff; 
      text-decoration:none; 
      }

這裏是PHP代碼，我用<?include ('dropdown.php')?>在我的網站，包括這在CMS建網站。

<link rel="stylesheet" href="dropdown/dropdown3.css" type="text/css" /> 
<ul class="dropdownmenu"> 
    <li ><a href="?category_id=140" class="top_link"><span>Home & Garden <img src="dropdown/down.gif"></span></a> 
    <ul class="sub"> 
     <li><a href="?category_id=145">ArtWork</a></li>   
     <li><a href="?category_id=146">Bedding & Bath</a></li> 
     <li><a href="?category_id=150">Kitchen & Dining</a></li> 
     <li><a href="?category_id=151">Patio, Lawn & Garden</a></li> 
     <li><a href="?category_id=152">Pet Supplies</a></li> 
     <li><a href="?category_id=153">Sewing, Craft & Hobbies</a></li> 
     <li><a href="?category_id=154">Vacuum, Cleaning & Storage </a></li> 
    </ul> 
    </li> 
</ul>

我還能在IE中修復它嗎？

此外，當下拉菜單被徘徊時，它會顯示＃2580a2的背景顏色，可以在.dropdownmenu li a:hover處看到此特定事物未在Chrome中顯示。可能是什麼原因？

來源

2010-07-10 Scorpion King

您可能要發佈更多的代碼渲染引擎，由於這似乎並不完整。看到這裏：http://jsfiddle.net/sRqJ8/（唯一不同的是，我用UL封裝了外部列表） – 2010-07-10 17:23:50

http://jsfiddle.net/sRqJ8/3/。我已經更新了它。但我無法獲得下拉列表中的藍色背景以使用chrome？ – 2010-07-10 20:51:29

我將'.dropdownmenu li ulli a：hover'改爲'.dropdownmenu li ul li：hover'來修復Chrome中的懸停。請參閱http://jsfiddle.net/HRSSF/。該菜單也適用於IE8 – jao 2011-05-30 05:50:24

使用Internet Explorer兼容性在該網站上查看可能有助於正確顯示。嘗試一下。

來源

2011-06-01 07:55:02 Sagotharan

我使用的是jQuery Dropdown，因此在任何瀏覽器都沒有任何錯誤。

如果你的菜單將工作做好Explorer兼容性視圖爲「Sagotharan」建議你可以重寫IE通過將其設定呈現爲IE7始終，像這樣

<meta http-equiv="X-UA-Compatible" content="IE=7" />

來源

2011-06-01 08:22:01 eugeneK

下拉菜單在IE8中消失

回答

相關問題