Javascript 显示框div及其下的文本

我有3个图像，我想在它们下面以内联方式显示它们，但不使用引导网格系统，因为我希望它们彼此靠近并居中，我尝试过这样做，但一旦我添加了它们在彼此下面显示的文本，我如何解决这个问题？这是我的密码：

.box{
显示：内联；
}

试验

试验

试验

您很接近，但它应该是

display:inline block

。请参阅代码片段：

.box{
显示：内联块；
}

试验

试验

试验

您也可以在父级上使用

flex

，它会将它们并排放置

.box{
显示器：flex；
证明内容：中心；
}

试验

试验

试验

解救他们（同时使用正确的HTML语义和无内联CSS样式）

.container{display:flex；justify content:center；}
.container图{文本对齐：居中；边距：0；}
.container img{高度：120px；}

试验
试验
试验

这太完美了，谢谢你，只是我不能把它们放在我页面的中心。你知道为什么吗？你想要它，这样盒子之间就没有空间了？是的，请稍等，我将更新答案。是的，我希望它们居中于页面，不留空格