CSS錯誤或IE兼容性問題？

在主菜單下拉菜單中遇到一個意外的奇怪圖標，其中包含圖片，如附圖所示。此問題與IE 8，IE 9，IE 10.值得慶幸的是不IE 11. Link to the website CSS錯誤或IE兼容性問題？

兼容性問題或CSS錯誤仍然存在？或者它與文檔類型聲明有什麼關係？我的doctype聲明讀爲<meta http-equiv="X-UA-Compatible" content="IE=9,chrome=1">

我正在使用此drop-down plugin的修改版本。

在下拉每個菜單項是：

<li id="li1" class="li-img"> 
    <a class="alink" href="somelink.html"></a> 
    <img class="img-fade"> 
</li> 


.li-img{ 
color: #ffffff; 
font-weight: bold; 
width: 25%; 
height: 80px; 
margin: 0px; 
} 

.alink{ 
position: absolute; 
top: 10px; 
left: 10px; 
opacity: 1 !important; 
z-index: 1000; 
} 

.img-fade{ 
-webkit-transition: opacity 0.25s ease-in-out; 
-moz-transition: opacity 0.25s ease-in-out; 
-o-transition: opacity 0.25s ease-in-out; 
-ms-transition: opacity 0.25s ease-in-out; 
transition: opacity 0.25s ease-in-out; 
position: absolute; 
opacity: 1; 
cursor: pointer; 
} 

.img-fade:hover{ 
opacity: 0.4; 
} 

#li1 img{ 
content:url(../img/dd/private-bank.jpg); 
width: 232px; 
clip: rect(0px, 232px, 80px, 0px); 
}

screenshot