Html 如何将浮动在其中的图元居中<；部门>；？

我需要修复现有网页上的一个问题，我需要将具有

float:left在一个大的
内。我不想删除浮动，我想知道什么是使这些元素居中并使它们成为两行的最佳方法


.big{
宽度：150px；
高度：150像素；
背景：金；
}
.a{
保证金：5px；
宽度：50px；
高度：20px；
文本对齐：居中；
浮动：左；
背景色：红色；
}

1.
2.
3.
4.
您可以使用flexbox


.big{
显示器：flex；
弯曲方向：行；
柔性包装：包装；
证明内容：中心；
对齐项目：居中；
背景：金；
宽度：150px；
高度：150像素；
}
.a{
弹性：0.35%；
保证金：5px；
宽度：50px；
高度：20px；
文本对齐：居中；
浮动：左；
背景色：红色；
}

1.
2.
3.
4.
浮动使这变得很奇怪。否则
.big{
宽度：150px；
高度：150像素；
背景：金；
文本对齐：居中；
}
.a{
显示：内联块；
保证金：5px自动；
宽度：50px；
高度：20px；
文本对齐：居中；
背景色：红色；
}

1.
2.
3.
4.
如果你不想浮动到顶部和左侧，我认为浮动没有意义。您需要掌握
位置
和
显示
属性的使用。我相信这就是你要找的。我已经在下面解释了相关的显示和位置属性，以及我为什么使用我所做的


.big{
宽度：150px；
高度：150像素；
背景：金；
}
.a{
位置：相对位置；
左：12px；
显示：内联块；
保证金：5px；
宽度：50px；
高度：20px；
文本对齐：居中；
背景色：红色；
}
为什么需要使用
浮动
，还要水平居中还是垂直居中？