我知道那个设定margin: 0 auto;on 元素用于将其居中(左右)。

所以我的问题很简单:必须在元素及其父元素上设置哪些 CSS 属性才能margin: 0 auto;让孩子左右居中?

答案

我的头顶上浮现出:

  1. 该元素必须是块级的,例如display: block或者display: table
  2. 元素不能浮动
  3. 元素不得具有固定或绝对位置^1^

脱离别人的头顶:

  1. 该元素必须有一个width那不是auto^2^

注意all这些条件必须满足位于中心的元素才能工作。


^1^ ~有一个例外:如果您的固定或绝对定位元素有left: 0; right: 0,将要居中并带有自动边距。~

^2^ ~从技术上来说,margin: 0 auto确实适用于自动宽度,但自动宽度优先于自动边距,并且自动边距因此被清零,使得它们看起来好像"不起作用"。~

来自: stackoverflow.com