如何对齐水平项？

Question

我想在移动视图中对齐这些元素

我想在移动设备上将图像放在文本的顶部而不是侧面。

<div class="container">
    <div class="row vcenter">
        <div class="col-xs-12 col-sm-6 col-md-2">
            <h3>Why Us?</h3>
        </div>
        <div class="col-xs-12 col-sm-6 col-md-10 items_why">
            <div class="col-xs-12 col-sm-6 col-md-3">
                <img src="/assets/img/icons/destination_expert.png"> 
                <span>Destination Expert</span>
            </div>
            <div class="col-xs-12 col-sm-6 col-md-3">
                <img src="/assets/img/icons/faster.png">
                <span>Faster</span>
            </div>
            <div class="col-xs-12 col-sm-6 col-md-3">
                <img src="/assets/img/icons/transparent.png"> 
                <span>Transparent</span>
            </div>
            <div class="col-xs-12 col-sm-6 col-md-3">
                <img src="/assets/img/icons/cheaper.png"> 
                <span>Cheaper</span>
            </div>
        </div>
    </div>
</div>

Answer 1

包含<div>的{​​{1}}应包含在另一行中，以便它们可以成为网格中另一个网格的一部分。

<span>

您可以在此处试用：https://www.bootply.com/new