文本对齐在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; 
}