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

Question

我試圖將我的“li”定位為內聯，所以我在一行中有三個圖像，並且在它們下面有文本（如產品目錄視圖）。 到目前為止，我的代碼使用 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;
}