2012-08-02 59 views
0

Fiddle Here文本不顯示以下圖片在IE

我的問題是,爲什麼沒有縮略圖下顯示IE的標題文字(8和更早版本)。在所有其他瀏覽器中工作正常。

HTML:

<div id="thumbsGrid"> 
    <div class= "thumbs"> 
     <a href="http://youtu.be/A30XhK8Vtmg"> 
      <img src="http://www.jillmedinger.com/NCPIE/images/thumbs/shadowed/recoverythumb.png"id="1.thumb"/> 
     </a> 
     <h4><a href="http://youtu.be/A30XhK8Vtmg">Ben</a></h4> 
    </div> 
    <div class= "thumbs"> 
     <img src="http://www.jillmedinger.com/NCPIE/images/thumbs/shadowed/recoverythumb.png" id="2.thumb"/> 
     <h4><a href="/NCPIE/resonator.html"> The Resonator</a></h4> 
    </div> 
    <div class= "thumbs"> 
     <a href="/NCPIE/re.html"> 
      <img src="images/thumbs/door2/friendsThumbs.png"id="3.thumb"/> 
     </a> 
     <h4><a href="/NCPIE/re.html">RE-Covery</a></h4> 
    </div> 
    <div class= "thumbs"> 
     <a href="/NCPIE/divedeeper2.html"> 
      <img src="images/thumbs/door2/divedeeper2Thumb.png"id="5.thumb"/> 
     </a> 
     <h4><a href="/NCPIE/divedeeper2.html"> Dive Deeper </a></h4> 
    </div> 
    <!--thumbsGrid close-->  
</div> 

CSS:

.thumbs { 
    float:left; 
    width:100px; 
    height:100px; 
    margin-right:12px; 
    margin-bottom:0; 
    border:0; 
    padding:0; 
} 
#thumbsGrid { 
    float:left; 
    width:500px; 
    min-height:216px; 
    margin-left:110px; 
    border:0; 
    padding-right:40px; 
    background: black; 
} 
.thumbs h4 a { 
    color: #FFF; 
} 

這裏,它是活的:www.jillmedinger.com/NCPIE/door2.html

回答

0

它與filter做在.thumbs。最簡單的解決方法是將position: relative設置爲h4,this fiddle shows