2012-10-17 64 views
2

我正在爲Wordpress中的客戶開發一個網站。網站www.daanen-shipping.nl有一個下拉菜單,在FF/Chrome和Safari瀏覽器中工作正常,但IE中沒有。客戶正在使用IE 9.顯然這對很多人來說都是一個常見問題。兼容性視圖似乎不成問題。Wordpress下拉菜單在IE中不起作用

林有點新的CSS和JavaScript,所以我不知道從哪裏開始。我做了幾個小時的研究結果。希望有人能幫助我。

菜單CSS:

#menu { 
    position: absolute; 
    right: 100px; 
    top: 180px; 
} 
#menu ul li { 
    float: left; 
    text-transform: uppercase; 
    font-size: 13px; 
    margin: 0 0 0 20px; 
    position: relative; 
    display: inline-block; 
    padding: 0 0 10px 0; 
} 
#menu ul li a { 
    color: #fff; 
    padding: 4px 1px; 
    display: inline-block; 
} 
#menu ul li:hover a, #menu ul li.current-menu-item a, #menu ul li.current-menu-parent a { 
    text-decoration: none; 
    border-bottom: #fff 3px solid; 
    padding: 4px 1px; 
    display: inline-block; 
} 
#menu ul li:hover a { 
    margin-bottom: 5px; 
} 
#menu ul li.current-menu-item ul.sub-menu li a { 
    color: #7b7b7b; 
} 
#menu ul li ul.sub-menu li, #menu ul li ul.sub-menu li a { 
    margin: 0; 
    padding: 0; 
} 
#menu ul li ul.sub-menu { 
    display: none; 
} 
#menu ul li:hover ul.sub-menu { 
    position: absolute; 
    top: 30px; 
    left: 0px; 
    background: #EBEBEB; 
    border: #ddd 1px solid; 
    width: 200px; 
    padding: 5px 0 2px 0; 
    overflow: hidden; 
    -webkit-border-radius: 5px; 
    -moz-border-radius: 5px; 
    border-radius: 5px; 
} 
#menu ul li ul.sub-menu li { 
    width: 100%; 
} 
#menu ul li ul.sub-menu li a { 
    padding: 8px 15px; 
    text-decoration: none; 
    border: 0px; 
    color: #7b7b7b; 
} 

如果有別的東西,我需要發佈更清晰,請讓我知道,在其沒有工作。 在此先感謝!

William。

+0

你能否提供該網站的鏈接? –

+0

www.daanen-shipping.nl –

+0

任何人都可以幫助我嗎? –

回答

0

命中f12並確保該網站使用的是IE 9標準。如果它不切換到IE9標準,並看看是否修復它。如果是這樣,你可以在頭部添加一些代碼,告訴瀏覽器'用戶是否使用IE 8使用IE8標準,或者如果用戶使用IE 9,則使用IE 9標準'。 IE是3個瀏覽器中的一個(7,8和9),它有一個壞習慣,在某些站點上切換到IE7和怪癖模式。讓我知道,如果它改變爲IE9標準,如果它可以工作,我會看看我是否可以挖掘代碼來添加強制標準。

+0

請參閱上面的Yogesh評論...您也可以嘗試添加MSDN博客http://blogs.msdn建議的的.com/b /即/存檔/ 2010/06/16/IE-S-兼容性特徵換站點developers.aspx – ItsGeorge