IE7 - 浮動圖像消失！

好的。這是情況。我在我的一個網站上設計評論部分。這裏有一個例子標記：IE7 - 浮動圖像消失！

<ol class="comments"> 
     <li> 
      <a href="/view/profile/id/2"> 
       <img src="/images/photo-thumb.gif" alt="johndoe" /> 
      </a> 

      <p class="pad-top"><em>written on Sunday 2nd of August 2009 12:12:54 AM by <a href="/view/profile/id/2" class="blue">johndoe</a></em></p> 
      <p class="pad-top pad-bottom">One more comment :D:D:D</p> 
      <div class="clear"></div> 
     </li> 
     <li> 
      <a href="/view/profile/id/2"> 
       <img src="/images/photo-thumb.gif" alt="johndoe" /> 
      </a> 

      <p class="pad-top"><em>written on Thursday 30th of July 2009 02:59:48 AM by <a href="/view/profile/id/2" class="blue">johndoe</a></em></p> 
      <p class="pad-top pad-bottom">Testing comments lalala<br /> 
      <br /> 
      Testing comments lalala<br /> 
      <br /> 
      Testing comments lalala</p> 
      <div class="clear"></div> 

     </li> 
    </ol>

這裏是我如何造型吧：

.comments li { 
    margin-top: 1em; 
    padding: 0 1em; 
    background: #3a3a3a; 
} 
.comments img { 
    float: left; 
    margin: 1em 1em 1em 0; 
    border: 1px solid #4f5055; 
} 
.clear { 
    clear: both; 
} 
.pad-top { 
    padding-top: 1em; 
} 
.pad-bottom { 
    padding-bottom: 1em; 
}

一切都在IE7以外的所有瀏覽器，其中浮動圖像消失的偉大工程。爲了演示，這裏是它的外觀在IE8，火狐等（這就是它應該如何看）：

http://richardknop.com/pic2.gif

這裏是它的外觀在IE7：

http://richardknop.com/pic1.gif

任何人知道如何解決這個問題？我已經嘗試了漂浮錨點，而不是其他許多技巧，但我不能讓它在IE7中正常工作。

來源

2009-08-05 Richard Knop