html - 如何居中对齐 span 后跟 div 中的 div

Question

我有以下代码，我想在父 div 中居中对齐 span 和 div。我怎样才能实现它？如果我给出左侧和绝对位置，在平板电脑上对齐会发生变化并且需要进行媒体查询。如果没有它，我有什么办法可以解决它吗？

<div>
    <span  data-toggle="toggle">
        <input class="button" data-on="On" data-off="Off" type="checkbox">
        <div class="toggle-group">
            <label class="btn btn-primary toggle-on">
                On
            </label>
            <label class="btn btn-default toggle-off active">
                Off
            </label>
            <span class="toggle-handle btn btn-default"></span>
        </div>
    </div>
</div>

Answer 1

使用text-align: center

.wrapper > span{display:block; text-align:center}
.wrapper > div{text-align:center}
.wrapper > div > div{display: inline-block}

Demo updated

---

单行获取child span和div

.wrapper{text-align:center}
.wrapper div{display:inline-block}

Demo 2