我该如何将我的div集中在另一个Div中

Question

我的内部div具有此CSS：

.square3 {
  border:solid 1px #008CBA;
  background-color:white;
  position: relative;
  width: 100%;
  max-width:500px;
  box-sizing: border-box;
  display: inline-block;
  float:left;
}
.square3:after {
  content: "";
  display: inline-block;
  padding-bottom: 100%;
  box-sizing: border-box;
}

我的外部Div具有此CSS：

.monthInfo{
  position: relative;
  width: 100%;
  max-width:100%;
  box-sizing: border-box;
  display: inline-block;
  float:left;
  content: "";
  display: inline-block;
  box-sizing: border-box;
  z-index:1000;
}

我尝试给出我的外部文本主修：中心和内部边距：0自动，但这无效。内部div一直到页面的左侧。我希望它留在中心。

Answer 1

text-align: center如果您从孩子中删除 float: left，则会工作。

.square3 {
  border:solid 1px #008CBA;
  background-color:white;
  position: relative;
  width: 100%;
  max-width:500px;
  box-sizing: border-box;
  display: inline-block;
}
.square3:after {
  content: "";
  display: inline-block;
  padding-bottom: 100%;
  box-sizing: border-box;
}
.monthInfo{
  position: relative;
  width: 100%;
  max-width:100%;
  box-sizing: border-box;
  display: inline-block;
  float:left;
  content: "";
  display: inline-block;
  box-sizing: border-box;
  z-index:1000;
  border: 1px solid red;
  text-align: center;
}

<div class="monthInfo">
  <div class="square3">
  </div>
</div>