证明父母留下的div

我有以下要求.

绿色父母宽度将根据设备宽度而变化.我需要所有的盒子都在父母的中心.

我已经尝试了以下的东西,但它没有帮助我.

试验1
Parent {text-align:center} box {display:inline-block}.

这导致了以下输出

试用2
Parent {text-align:center} box{float:left}.

这导致了以下输出

试验3
Parent {display:flex} box -> justify-around & justify-between也没有奏效.

.parent {
  text-align: center;
}
.item {
  display: inline-block;
  width: 100px;
  height: 100px;
  background: red;
}