如何集中这个标题？

Question

我正在尝试将我的标题链接（产品名称）作为中心，但是当我使用text-align : center，margin:auto等时，它仍然无法移动。有人请指出我正确的方向吗？

以下是a fiddle供参考。

Html代码：

<a href="#"><img src='jpg' alt='Image' /></a>
 <h3>
 <a href="%PRODUCT_URL%">Product Name</a>
 </h3>

CSS：

.prod-box h3 a{
    text-decoration: none;
    width:140px;
    text-align : center ;
    margin: 5px 0;
    color:#888;
    font: italic normal 14px georgia;
    font-style: italic;
}

Answer 1

将样式应用于h3，而不是a。

.prod-box h3

或制作a display: block;

Answer 2

请改为尝试：

.prod-box h3{
    text-decoration: none;
    width:140px;
    text-align : center ;
    margin: 0 auto;
    color:#888;
    font: italic normal 14px georgia;
    font-style: italic;

}