twitter-bootstrap 为什么我的 Bootstrap 推拉 div 不起作用？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/39559733/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Why is my Bootstrap push & pull divs not working?
提问by user1996496
I want to have 2 divs besideseach other for col-md and higher, while having them aboveeach other for col-sm and lower. So I tried to use the push and pull feature as mentioned in the docs but somehow it's not working. What I'm trying to do is get the RIGHT div abovethe LEFT div on col-sm and lower, basically reversing the order.
我希望besides彼此拥有 2 个 div col-md and higher，同时让它们above彼此拥有col-sm and lower. 所以我尝试使用文档中提到的推拉功能，但不知何故它不起作用。我想要做的是above在 col-sm 和更低的位置获得 RIGHT div LEFT div，基本上是颠倒顺序。
What am I doing wrong?
我究竟做错了什么？
<div class="container">
<div class="row">
<div class="col-sm-12 col-sm-push-12 col-md-7">LEFT</div>
<div class="col-sm-12 col-sm-pull-12 col-md-5">RIGHT</div>
</div>
</div>
Here's a fiddle: https://jsfiddle.net/ko7euh77/1/
这是一个小提琴：https: //jsfiddle.net/ko7euh77/1/
回答by Zim
You just need to think "mobile-first"..
您只需要考虑“移动优先”..
<div class="container">
<div class="row">
<div class="col-sm-12 col-md-push-7 col-md-5">RIGHT</div>
<div class="col-sm-12 col-md-pull-5 col-md-7">LEFT</div>
</div>
</div>
Demo: http://www.codeply.com/go/2SN4r7KGwV
演示：http: //www.codeply.com/go/2SN4r7KGwV
Bootstrap 4 Update
引导程序 4 更新
The push pull class are now order-*(using flexbox) in Bootstrap 4.
推拉类现在order-*（使用 flexbox）在 Bootstrap 4 中。
https://www.codeply.com/go/l3BOOH6JM9
https://www.codeply.com/go/l3BOOH6JM9
<div class="row">
<div class="col-md-5 order-md-2">
<div class="card card-body">RIGHT</div>
</div>
<div class="col-md-7 order-md-1">
<div class="card card-body">LEFT</div>
</div>
</div>
回答by MEHUL JOSHI
It totally depends on the version you are using, for bootstrap 4 and above you can push and pull like this: one more thing here order doesn't mean to the grid of the scree it will be the no.
这完全取决于您使用的版本，对于 bootstrap 4 及更高版本，您可以像这样推拉：这里的另一件事订单并不意味着对 scree 的网格，它将是否。
<div class="row">
<div class="col-sm-2 order-md-2 order-sm-1" >
<div >RIGHT</div>
</div>
<div class="col-sm-10 order-md-1 order-sm-2 ">
<div >LEFT</div>
</div>
</div>
