Question

我有三个div，类=＆＃34; col-md-4 col-xs-6＆＃34;，class =＆＃34; col-md-4 col-xs-12＆＃34;，class = ＆＃34; col-md-4 col-xs-6＆＃34;
它在中等屏幕视图中折叠成一行：

    div 1 | div 2 | div 3

将其调整为xs：
后

    div 1 (xs 6) 

    div 2 (xs 12) 

    div 3 (xs 6)

我怎么能像这样摆脱这个崩溃：

    div 1 (xs 6) | div 3 (xs 6) 

    div 2 (xs 12)

我想我可以在xs视图中隐藏div 3并制作div 3的副本，将它放在div 1之后，这将变为可见。但是没有任何出版方式吗？

Answer 1

我自己发现了如何做到这一点。继承了我的解决方案：

<div class="col-md-4 col-xs-6">1</div>
<div class="col-md-4 col-xs-12">2</div>
<div class="col-md-4 col-xs-6">3</div>

重写为：

<div class="col-md-4 col-xs-6">1</div>
<div class="col-md-4 col-xs-6 pull-right">3</div>
<div class="col-md-4 col-xs-12">2</div>

http://jsfiddle.net/tkgfzzx4/10/

Answer 2

<div class="col-md-4 col-xs-6 order-1 order-md-1">1</div>
<div class="col-md-4 col-xs-12 order-3 order-md-2">2</div>
<div class="col-md-4 col-xs-6 order-2 order-md-3 ">3</div>

使用最新版本的bootstrap尝试此操作。

重新安排twitter bootstrap div以折叠到不同的顺序

2 个答案: