当 margin:0 自动居中图像；并且绝对定位不起作用答案

【问题标题】：Centring an image when margin:0 auto; and absolute positioning doesn't work当 margin:0 自动居中图像；并且绝对定位不起作用
【发布时间】：2015-10-16 21:09:32
【问题描述】：

我正在尝试使此页面中的大多数图像居中，我需要居中的所有图像都属于 .loadMeLater 类。

图像是加载微调器占位符，然后当真实图像出现在视口中时会加载它。我希望占位符和真实图像居中。它们都在同一个元素中，具有 .loadMeLater 类。

我尝试了margin:0 auto，但不起作用，我不能使用绝对定位和left:0 和right:0，因为这会导致图像的容器太小。

目前我正在使用相对定位、left:50% 和 margin-left:-0.5*spinner-width; 使微调器居中我正在使用 javascript 中的计算使图像居中，该计算涉及图像和父级的宽度。

必须有一种更简单的方法来使图像居中。任何人都知道如何做到这一点？

这里是网站：http://irfandesign.com/dev/

要显示具有图像的元素，请单击“了解我的更多信息”或“工作”。然后向下滚动到它们。

【问题讨论】：

共享链接已损坏

标签： html css

【解决方案1】：

试试吧

margin:auto;

我不确定你所拥有的是否真的是一个有效的实现。

【讨论】：

它怎么不是一个有效的实现？
具有保证金：0自动；是多余的；你是说'边距为零，但也自动适应'

【解决方案2】：

默认情况下，img 标签有 'display: inline-block;'

如果您选择您的 img 标签并执行此操作：

img {
    display:block;
    margin: 0 auto;
}

它将您的图像在其容器 div 中居中

【讨论】：