文本對齊在IE中不起作用？

Question

我試圖將我的「李」放在內聯中，所以我在一行中有三個圖像，並且在它們下面有文本（如產品目錄視圖）。到目前爲止，我的代碼使用chrome顯得很好，但IE卻將所有內容都對齊了。

CSS：

#products ul{ 
    margin:0px; 
    padding:0px; 
    margin-top: 50px; 
} 
#products li{ 
    list-style-type:none; 
    float:left; 
    display:inline; 
    height:auto; 
    padding: 10px 10px; 

} 
#products img{ 
    max-width:250px; 
    padding:20px; 
    float:left; 

} 
#products ul li p{ 
    text-align:center; 
    font-weight:200; 
    font-family:Verdana, Geneva, Tahoma, sans-serif; 

HTML：

<HeaderTemplate> 
     <div id="products"> 

      <h2>ALL PRODUCTS</h2> 
      <ul> 
     </HeaderTemplate> 
     <ItemTemplate> 
      <li><a href="<%# Eval("ProductID", "Productdetails.aspx?ProductID={0}")%>"><img src="<%#Eval("ProductImage") %>" /></a> 
       <p><%#Eval("ProductName") %></p> 
       <p>$<%# Eval("ProductPrice") %></p></li> 

     </ItemTemplate> 
     <FooterTemplate> 
      </ul> 
      </div> 
     </FooterTemplate> 

Answer 1

試試這個：

#products li a { 
    display: block; 
}