css - Bootstrap:杂乱列同时使用推和拉列排序

我在同时使用Push和Pull列排序类时遇到问题。

I Want Ordering Columns Like This:

But Result In md & Larger Screen Size is

<section style="direction:rtl;">
<div class="container">
<div class="row">
  <div class="col-sm-12">
    <div class="row">
      <div class="col-sm-4 col-sm-push-8 col-md-3 col-md-push-9"><div class="well">Column 1</div></div>
      <div class="col-sm-4 col-sm-push-0 col-md-3 col-md-push-3"><div class="well">Column 2</div></div>
      <div class="col-sm-4 col-sm-pull-8 col-md-3 col-md-pull-3"><div class="well">Column 3</div></div>
      <div class="col-sm-4 col-sm-push-8 col-md-3 col-md-pull-9"><div class="well">Column 4</div></div>
      <div class="col-sm-4 col-sm-push-0 col-md-3 col-md-push-9"><div class="well">Column 5</div></div>
      <div class="col-sm-4 col-sm-pull-8 col-md-3 col-md-push-3"><div class="well">Column 6</div></div>
      <div class="col-sm-4 col-sm-push-8 col-md-3 col-md-pull-3"><div class="well">Column 7</div></div>
      <div class="col-sm-4 col-sm-pull-0 col-md-3 col-md-pull-9"><div class="well">Column 8</div></div>
      <div class="col-sm-4 col-sm-pull-8 col-md-3 col-md-push-9"><div class="well">Column 9</div></div>
      <div class="col-sm-4 col-sm-push-8 col-md-3 col-md-push-3"><div class="well">Column 10</div></div>
      <div class="col-sm-4 col-sm-pull-0 col-md-3 col-md-pull-3"><div class="well">Column 11</div></div>
      <div class="col-sm-4 col-sm-pull-8 col-md-3 col-md-pull-9"><div class="well">Column 12</div></div>
    </div>
  </div>
</div>

最佳答案

您需要重置从sm屏幕继承过来的md和lg屏幕的推拉。

<div class="col-sm-4 col-sm-push-8 **col-md-push-0** col-md-3 col-md-pull-9"><div class="well">Column 4</div></div>

http://www.bootply.com/1NedaZMxUf

关于css - Bootstrap:杂乱列同时使用推和拉列排序，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/36700718/