我能想到的是:

元素必须是块级的，例如display: block或display: table 元素不能浮动 元素不能有固定或绝对位置1

在别人的头脑中:

元素的宽度必须不是auto2

注意，对于居中的元素，所有这些条件都必须为真才能工作。

有一个例外:如果你的固定或绝对定位元素已经离开:0;右:0，它将以汽车边际为中心。

从技术上讲，margin: 0 auto确实适用于auto width，但auto width优先于auto margin，因此auto margin被归零，使其看起来好像“不起作用”。

在我看来，它需要一个宽度。你需要指定你正在居中的容器的宽度(不是父宽度)。

在我的脑海中，如果元素不是块元素-让它成为块元素。

然后给它一个宽度。

请查看我创建的jsFiddle的快速示例。希望这很容易理解。您可以使用包装div与网站的宽度居中对齐。你必须设置宽度的原因是，这样浏览器就知道你不是在使用流动布局。

也许有趣的是，您不必为<button>元素指定宽度来使其工作-只需确保它具有display:block: http://jsfiddle.net/muhuyttr/

它还可以与display:table一起工作——在这种情况下，这是一个有用的显示属性，因为它不需要设置宽度。(我知道这篇文章已经5年了，但它仍然与路人有关;)

CSS的完整规则:

(显示:块和宽度不是自动的)或显示:表 浮:没有 位置:相对或位置:静态

OR

带有display: flex的父元素

以下是我的建议:

First: 
      1. Add display: block or table
      2. Add position: relative
      3. Add width:(percentage also works fine)
Second: 
      if above trick not works then you have to add float:none;

在我的猫的头顶上，确保你试图居中的div没有设置为宽度:100%。

如果是，那么在子div上设置的规则才是重要的。

For anybody just now hitting this question, and not being able to fix margin: 0 auto, here's something I discovered you may find useful: a table element with no specified width must have display: table and not display: block in order for margin: auto to do work. This may be obvious to some, as the combination of display: block and the default width value will give a table which expands to fill its container, but if you want the table to take it's "natural" width and be centered, you need display: table

如果你的父元素没有固定的宽度，让你的父元素带有display: flex对我来说很有效。