居中对齐图像

Question

我一直试图将这些图像居中对齐，但它们不会去。我正在尝试使用尺寸调整和左对齐，但没有任何作用。我该怎么办？

这是JSFiddle：http://jsfiddle.net/4uGtq/embedded/result/

left-align:50%; /* Doesn't work */

Answer 1

当我尝试您的演示（在Chrome中）时，只要我没有将浏览器的大小调整为超过1300像素宽，图像就会作为一个组对齐。因此，对于不同的@media only screen，您有一堆max-width规则，而您最高的数字是(max-width: 1300px)，这种行为是否有意义呢？

更改此行：

@media only screen and (max-width: 1300px) {

到此：

@media only screen and (min-width: 1001px) {

它应该按照此处所示进行修复：http://jsfiddle.net/4uGtq/6/embedded/result/

Answer 2

#icon-wrapper a {
    display: inline-block;
    width: 175px;
    height: 175px;
}

在这种情况下，宽度和高度是必要的，因为您的图像绝对定位。如果你没有宽度和高度，那么一切都会陷入其中。