不能把div放在中心（保证金：0自动;不工作）

Question

我想将div放在中心（水平）。 与此同时，我想把div保证金最高点：40px和保证金底部：20px。 但是一旦我分配了保证金：0自动，保证金顶部和底部不起作用。

#circle_price {
  background-color: red;
  width: 100px;
  height: 100px;
  background: red;
  -moz-border-radius: 50px;
  -webkit-border-radius: 50px;
  margin-top: 40px;
  margin-bottom: 20px;
  margin: 0 auto;
}

有人对此有所了解吗？感谢。

Answer 1

等于margin: 0 auto的

margin: 0 auto 0 auto将覆盖您之前设置的属性，即margin-top和margin-bottom重置为0.

您需要使用margin: 40px auto 20px auto，这是margin-top margin-right margin-bottom和margin-left的缩写，顺时针顺序。

.center-me {
  margin: 40px auto 20px auto;
  width: 300px;
  background: lightblue;
}

<div class="center-me">Centered block</div>

Answer 2

margin: 0 auto;
margin-top: 20px;
margin-bottom: 100px;

它有效。