jQuery Internet Explorer 7,8,9では、6枚の画像を含む横長のアコーディオンが2つ欠けていますか？

Question

私はjQuery水平アコーディオンを作成するためにthisチュートリアルに従いました。 それはOK動作しますが、あなたはライブサイトで見ることができるようにIE 7、図8、図9に二つの絵が（彼らは6です）不足している：

http://brianfunshine.com/

HTML：

<div class="jimgMenu"> 
     <ul> 
      <li id="landscapes"><a href="http://alexchen.info/brianfunshine/events/jazz-shows/">Landscapes</a></li> 
      <li id="people"><a href="http://alexchen.info/brianfunshine/events/kid-events/">People</a></li> 
      <li id="nature"><a href="http://alexchen.info/brianfunshine/voice-demos/">Nature</a></li> 
      <li id="abstract"><a href="http://alexchen.info/brianfunshine/music-2/commercial-music-production/">Abstract</a></li> 
      <li id="urban"><a href="http://alexchen.info/brianfunshine/about/">Urban</a></li> 
      <li id="people2"><a href="http://alexchen.info/brianfunshine/2011/05/gallery-test/">People2</a></li> 
     </ul> 
    </div> 

JS ：

/** 
    * Horizontal Slider 
    */ 
    $j('.jimgMenu ul').kwicks({max: 310, duration: 300, easing: 'easeOutQuad'}); 
}); 

ヘッダ：

<link href="css/jimgMenukwicks.css" rel="stylesheet" type="text/css" /> 
<script type="text/javascript" src="js/jquery.js"></script> 
<script type="text/javascript" src="js/jquery-easing-1.3.pack.js"></script> 
<script type="text/javascript" src="js/jquery-easing-compatibility.1.2.pack.js"></script> 
<script type="text/javascript" src="js/jquery.kwicks-1.5.1.pack.js"></script> 

CSS：

.jimgMenu { 
    position:relative; 
    margin: 0 0 0 1px; 
    padding: 0px; 
    width: 958px; 
    height :200px; 
    overflow: hidden; 
} 
.jimgMenu ul { 
    list-style: none; 
    margin: 0; 
    padding: 0; 
    display: block; 
    height: 170px; 
    position: relative; 
    } 
.jimgMenu ul li { 
    width: 160px; 
    float: left; 
    display: block; 
    overflow: hidden; 
} 
.jimgMenu ul li a { 
    text-indent: -1000px; 
    background: #fff repeat scroll 0%; 
    border-right: 2px solid #fff; 
    cursor: pointer; 
    display: block; 
    overflow: hidden; 
    height: 200px; 
} 
.jimgMenu ul li#landscapes a { 
    background: url(../images/landscapes.png) repeat scroll 0% !important; 
} 
.jimgMenu ul li#people a { 
    background: url(../images/people.png) repeat scroll 0% !important; 
} 

.jimgMenu ul li#nature a { 
    background: url(../images/nature.png) repeat scroll 0% !important; 
} 
.jimgMenu ul li#abstract a { 
    background: url(../images/abstract.png) repeat scroll 0% !important; 
} 
.jimgMenu ul li#urban a { 
    background: url(../images/urban.png) repeat scroll 0% !important; 
} 
.jimgMenu ul li#people2 a { 
    background: url(../images/people2.png) repeat scroll 0% !important; 
} 

（すべてはChromeとFirefoxでOK動作します）。

（私は申し訳ありませんIEの出力を提供することはできませんので、私はLinux上でです。）

EDIT：リスト<li>タグがある場合

すべての画像が表示され幅の100pxに。私はオーバーフローがあると思う：隠された問題。しかし、幸運のほとんどすべての要素に幅を適用しようとしました）。

Answer 1

ここはこの行です：

<!--[if IE]> 
<style type="text/css">.jimgMenu { 
position:relative; 
width:630px; /* <<< Right here */ 
height:200px; 
overflow:hidden; 
margin-left:20px; 
} 
</style> 
<![endif]--> 

http://jfcoder.com/test/funshine.html

は、少なくともその削除し、それが正常に動作します。また、完全に削除してもうまくいくと思います。