相关疑难解决方法(0)

我有这个HTML:

<div class="object-box">
    <img ... />
    <span class="caption">This is the caption</span>
</div>

这附带了这个CSS:

.object-box .caption, .object-box img {
    display: block;
}
.object-box {
    border: 1px solid;
}

我希望周围的div收缩包装到它的内容.我可以通过使用float: ...或实现这一点display: inline-block.但是,我也希望它以页面为中心,使用margin: auto.这两种方法似乎不兼容.

是否可以在不添加包装元素的情况下创建这种收缩包装的中心容器？

编辑:

jsFiddle 在这里

所以我目前正在使用inline-block我的网站.我知道它仍然相对较新(5年的范围).我想知道这些天是否可以使用它,或者如果有人可以推荐我优雅的黑客,那将是非常棒的.谢谢你的时间.