ドロップダウンメニューがIE9で破損しました

Question

私は購入したテーマからFFを作成していますが、Chromeでは完璧に見えます。互換モードのIE9では大きな問題が生じています。 1つのメニュー項目にドロップダウンがあり、IEではそのドロップダウンメニューが次のメニュー項目の下に移動し、それをクリックするのは非常に難しいです。CSSナビゲーションとメニュー設定で "再生"しようとしました。 。 できるすべてのヘルプ：

/* 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; 

}

リンクです：http://goo.gl/LHDtg

Answer 1

は希望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; 
} 

のCSSの下にしてみてください

は、デモ用の画像を参照してください。私はIE8でそれを試してみました