水平和垂直居中图像

Question

  

可能重复：
  Center an Image vertically and horizontally using CSS

可能是一个简单的问题，我有一个想要垂直和水平居中的图像：

布局如下：

<div id="theDiv">
    <ul>
        <li>
            <a ...><img src=...></a>
        </li>
    ...
</div>

现在，我希望它居中的原因是因为图像大小不同，我希望它们在列表项中居中。

显然，我希望尽可能跨浏览器兼容性。到目前为止，我有：

#theDiv li a:first-child {
    height:120px;
    display:table-cell;
    text-align: center;
}
#theDive li a img {
    vertical-align:middle;
    margin-right:auto;
    margin-left:auto;
}

显然，vertical-align需要table-cell显示，但这会阻止它在水平方向上居中（否则就是这样）。

发现很多网站提供各种选项，但没有一种方法可以兼得。

干杯