强制图像在css中为方形和居中

Question

我试图调整不同图像的大小以适应平方div。 看起来我在这个主题中找到了一个完美的答案： Force bootstrap responsive image to be square @ web-tiki的答案很好用。唯一的问题是，图像不在周围的div中心。 我不知道为什么我不能在这篇文章中提出我的问题，因此我必须在这里写。任何想法如何将我（现在完美调整大小）的图像居中在div中？如果图像高于宽度，则它会粘在div的左侧。如果它宽于高，它会粘在div的顶部。

Answer 1

试试这个

.Container-of-the-image {
position:relative;
/*the rest of your classes to make it square*/

}

.Container-of-the-image img {
Position:absolute;
margin:auto;
top:0;
right:0;
left:0;
bottom:0;
max-height:100%;
max-width:100%;    
}

FIDDLE