下拉菜單打破IE9

我正在從一個購買的主題建立一個網站，並在FF和Chrome瀏覽器看起來很完美。但是，在IE9兼容模式下，我有一個大問題。一個菜單項有下拉菜單，在IE上，下拉菜單在下一個菜單項下移動，很難單擊它。我嘗試用CSS導航和菜單設置「玩」，但沒有運氣。。誰能幫助：下拉菜單打破IE9

/* Mainmenu Styling */ 
#mainmenu{ 
width:680px; 
margin:1px 0px 0px 0px; 
float:left; 
} 
.navigation{ 
width:630px; 
margin-top:38px; 
padding-left:160px; 
float:left; 
list-style-type:none; 
} 
.navigation ul{ 
margin:0px; 
padding:0px; 
list-style-type:none; 
position:left; 
clear:both; 
} 
.navigation li{ 
list-style-type:none; 
padding:0px; 
margin:0px; 
float:left; 
z-index:100; 
position:relative; 
} 
.navigation li a{ 
font-size:16px; 
text-decoration:none; 
color:#a7a6a6; 
display:block; 
padding:10px 30px 16px 8px; 
float:left; 
z-index:100; 
margin-right:0px; 
} 
.navigation li.current a, .navigation li a:hover, .navigation li.current li a:hover{ 
text-decoration:none; 
color: #d23a3b; 
} 
.navigation li.current li a{ 
text-decoration:none; 
color:#a7a6a6; 
} 
.navigation li li{ 
margin:0 0 0px 0px; 
padding:0px; 
position:relative; 
z-index:100;  
} 
.navigation ul{ 
display:none; 
position:absolute; 
top:45px; 
width:159px; 
padding-bottom:5px; 
z-index:100;  
background-color:#fafafa; 
border-top:none; 
border-bottom:1px solid #d3d3d3; 
border-left:1px solid #d3d3d3; 
border-right:1px solid #d3d3d3; 
} 
.navigation li ul a{ 
width:109px; 
height:auto; 
float:left; 
padding:0px 15px 8px 15px; 
font-size:14px; 
color:#a7a6a6; 
line-height:24px; 
z-index:100; 
text-decoration:none;

}

Link是：http://goo.gl/LHDtg

來源

2012-03-16 tokmak

也許你有作爲[這裏要注意]同樣的問題（http://blog.ninanet.com/2011/04/29/cufon-和ie9）（Cufon和IE9問題）？ – Jeroen 2012-03-16 11:39:41

檢查我的答案，讓我知道如果我滯後一些地方... – w3uiguru 2012-03-16 11:41:59

IE兼容性模式給了我惡夢。 – 2012-03-16 17:55:07

嘗試下面的CSS所需的IE版本

.navigation ul { 
    background-color: #FAFAFA; 
    border-color: -moz-use-text-color #D3D3D3 #D3D3D3; 
    border-style: none solid solid; 
    border-width: medium 1px 1px; 
    display: none; 
    padding-bottom: 5px; 
    position: absolute; 
    top: 85px; /* in your website it is 45px but for IE i just tried 85px which work fine*/ 
    width: 159px; 
    z-index: 100; 
}

看到演示圖像：我想它在IE8

enter image description here

來源

2012-03-16 11:38:05 w3uiguru

高興，謝謝:)我試過了，它看起來更好，但現在下拉已經移到右側（最右側）:)任何其他建議？ – tokmak 2012-03-16 11:50:15

ohh新問題，但親愛的沒有看到我如何檢查值和CSS ..你可以告訴我的演示。 – w3uiguru 2012-03-16 12:04:35

下拉菜單打破IE9

回答

相關問題