Bootstrap 3列折叠时排序答案

【问题标题】：Bootstrap 3 column ordering on collapseBootstrap 3列折叠时排序
【发布时间】：2015-04-01 16:40:08
【问题描述】：

我在一行中有这两列：

                <div class="row">
                    <div class="col-lg-4 col-md-4 col-sm-4">
                         <p>Column A</p>
                    </div>
                    <div class="col-lg-8 col-md-8 col-sm-8">
                        <p>Column B</p>
                        <div style="padding:10px;" class="text-center">
                            <a href="#" class="btn btn-dark pulse2"></a>
                        </div>
                    </div>
                </div>

所以当屏幕大小变成 xs 时，它们会按以下顺序折叠：

A栏

B 栏

但是我怎样才能让它们反过来倒塌呢？从我红色的其他问题中，我尝试将类 col-sm-pull-8 添加到 A 列，将 col-sm-push-4 添加到 B 列。

但它不起作用，它只是弄乱了布局，它们仍然像这样崩溃：

A栏

B 栏

【问题讨论】：

此答案是否需要仅使用 css 的解决方案？
我更喜欢这样。我可以在眨眼间用 jQuery 解决这个问题，但我更喜欢一个特定的解决方案。一定有办法！
Bootstrap 是移动优先的前端框架。您需要首先考虑移动设备。检查这个问题并回答stackoverflow.com/questions/26466407/…

标签： html css twitter-bootstrap twitter-bootstrap-3

【解决方案1】：

col-sm-pull-8 和 col-sm-push-4 工作正常，您只需交换您的订单：

<div class="row">
    <div class="col-lg-8 col-md-8 col-sm-8 col-sm-push-8">
        <p>Column B</p>
        <div style="padding:10px;" class="text-center">
            <a href="#" class="btn btn-dark pulse2"></a>
        </div>
    </div>
    <div class="col-lg-4 col-md-4 col-sm-4 col-sm-pull-4">
        <p>Column A</p>
    </div>
</div>

http://jsfiddle.net/yutngfjw/

【讨论】：

您的回答中有一些问题，但它给了我输入，我解决了我的问题，谢谢。
啊，我看到了，但我认为你明白了主要方面；）