如何在 parent div 中水平居中多个 div

how to horizontally center multiple div's in a parent div

我正在尝试创建一个包含多个 div 的控件,并且所有 div 都是水平居中对齐的。如下图

我能够使用 float:left css 属性 每 div 浮动一次。给出这样的东西

但永远 div 都留给了他们的 parent。

我有一个替代方案可以使用 javascript 来定位每个 div,但我想使用 css。 是否可以使用 css 实现此目的。

提前致谢

这可能会做你想做的事:

HTML:

<div class="parent">
    <div class="child">Element 1</div>
    <div class="child">Element 2</div>
</div>

CSS:

.child {
    display: inline-block;
}

.parent {
    text-align: center;
}

the fiddle.