ie9/CSS：彈出式菜單在ie9中不起作用，但在Firefox/Chrome中看起來很棒

請參閱此彈出式菜單：http://www.caseen.com/store.html。它在Firefox和Chrome瀏覽器中看起來都很棒，但在IE9中卻沒有！試圖看看發生了什麼=（。ie9/CSS：彈出式菜單在ie9中不起作用，但在Firefox/Chrome中看起來很棒

它看起來像ie9正在完成忽略樣式表，但在錯誤檢查和點擊ie9直接模式，它顯示然而非常醜陋的巨大討厭的白色邊界周圍的鏈接！

請看看我的代碼：

<div class="flyout"> 
          <ul> 
          <!--START: CATEGORIES--> 
          <!--START: CATEGORY_FORMAT--> 
          <li><a href="view_category.asp?cat=CATID">&nbsp;CATEGORY</a> 
          <!--END: CATEGORY_FORMAT--> 
           <ul><!--START: SUB_CATEGORY_FORMAT--> 
            <li><a href="view_category.asp?cat=CATID">&nbsp;CATEGORY</a></li> 
          <!--END: SUB_CATEGORY_FORMAT--></ul> 
          <!--END: CATEGORIES--> 
          </li> 
          </ul> 
          </div>

和CSS

.flyout { 
width: 130px; 
height: auto; 
position:relative; 
margin: -10 0; 
padding: 0; 
z-index:10000; 
} 

.flyout ul li a { 
display:block; 
text-decoration:none; 
color: #fff; 
width: 130px; 
border: solid; 
border-color: #000; 
border-width: 0 0 0 5px; 
text-align:left; 
font-size:12px; 
line-height: 25px; 
} 

.flyout ul { 
padding:0px; 
list-style-type: none; 
} 
.flyout ul li { 
float:left; 
margin-right:1px; 
position:relative; 
} 
.flyout ul li ul { 
display: none; 
} 

.flyout ul li:hover a { 
border: solid; 
border-color: #fff; 
border-width: 0 2 0 5px; 
color: #60dfe5; 
} 

.flyout ul li:hover ul { 
display:block; position:absolute; top:0; 
left:130px; 
width:10px; 
} 
.flyout ul li:hover ul li a.hide { 
background:#000; 
color:#fff; 
} 

.flyout ul li:hover ul li:hover a.hide {width:180px;} 
.flyout ul li:hover ul li ul {display: none;} 
.flyout ul li:hover ul li a { 
display:block; 
background:#000; 
color:#60dfe5; 
width:200px; 
} 
.flyout ul li:hover ul li a:hover { 
background:#000; 
color:#fff; 
}

來源

2012-03-28 Brandon

IE9被默認爲怪癖模式在您的網站，這樣有可能事端g與您的標記錯誤，無論是文檔類型還是一般結構。

看看這一審定報告：

http://validator.w3.org/check?uri=http%3A%2F%2Fwww.caseen.com%2Fstore.html&charset=%28detect+automatically%29&doctype=Inline&group=0

你有一些未關閉的標籤和其他重大問題。 IE可能會窒息這些並導致怪癖模式。首先，我建議您清理標記以消除這種可能性。它應該真的發生。

來源

2012-03-28 17:27:19

的CMS與老式模板提供的...我會看到我能做些什麼感謝。仍然看起來像IE9恨惡盤旋和類似的東西=（ – Brandon 2012-03-28 22:05:57

謝謝！看起來像幫助！ – Brandon 2012-03-30 18:20:12

偉大的。很高興它的幫助。 – 2012-03-30 18:29:05

你的DOCTYPE聲明是錯誤的，它應該是：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

雖然我建議HTML5s DOCTYPE：

<!DOCTYPE html>

來源

2012-03-28 19:08:09

ie9/CSS：彈出式菜單在ie9中不起作用，但在Firefox/Chrome中看起來很棒

回答

相關問題