Bootstrap 拉/推故障

Question

从这个问题开始我了解了Bootstrap列推拉

下面的代码片段几乎可以得到我想要的结果：

问题是调整屏幕大小，在大约 1200 像素宽度处，两个 aside 元素（蓝色和绿色）一个挨着另一个（您可以查看代码片段）。

有什么帮助吗？

div,aside { height: 50px}
.content { background: lightpink;}
.side1 { background: lightblue;}
.side2 { background: lightgreen;}

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" />

<div class="container">
  <div class="content left col-md-7 col-lg-push-2"></div>
  <aside class="side1 left col-md-2 col-lg-pull-7"></aside>
  <aside class="side2 left col-md-3"></aside>
</div>

Answer 1

这不是故障。你在混合尺寸。您的推送和拉取应设置在与列声明相同的断点处。

div,aside { height: 50px}
.content { background: lightpink;}
.side1 { background: lightblue;}
.side2 { background: lightgreen;}

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" />

<div class="container">
  <div class="content left col-md-7 col-md-push-2"></div>
  <aside class="side1 left col-md-2 col-md-pull-7"></aside>
  <aside class="side2 left col-md-3"></aside>
</div>

Bootstrap 拉/推故障

Bootstrap glitch in pull / push

css

twitter-bootstrap

twitter-bootstrap-3