Css 边距：自动不居中图像

我想将一组并排排列的图像居中。尽管使用了

margin:auto

，图像仍然向左对齐。我读入了另一个线程来添加

display:block

，但这也不起作用。想法

您还需要设置div的宽度

<div style="margin:auto;display:block;witdth:500px;">

下面是一个演示：

---

强烈推荐阅读CSS的box模型。在你花了一个小时去了解引擎盖下发生了什么之后，这会更有意义。

如果你移除

img

上的

float:left

元素，并添加

display:block

它们将居中。。。 当一个元素浮动时，它就完全脱离了流程。

根据，

margin:0自动将块级元素居中，因为

如果“左边距”和“右边距”都是“自动”，则使用它们的值
他们是平等的。这将使图元相对于图元水平居中
包含块的边

但是，如果
width
为
auto
，则这是无用的，因为这样块将填充其包含的块：

如果“宽度”设置为“自动”，则任何其他“自动”值将变为“0”，并且
“width”来自结果相等

相反，您可以使用表格显示。根据,

如果表格的边距设置为“0”，宽度设置为“自动”，则
表不会自动调整大小以填充其包含的块。
但是，一旦找到表的“宽度”计算值
（使用下面给出的算法，或在适当情况下，使用其他算法）
依赖算法），则不适用其他部分。
因此，表格可以使用左右“自动”边距居中，
比如说

div{
显示：表格；
保证金：0自动；
}


div{
显示：表格；
保证金：0自动；
边框：2件纯蓝；
}
跨度{
显示：内联块；
高度：20px；
宽度：20px；
边框：2倍纯红；
利润率：10px；
}

1.
2.