3个元素，右边应该在twitter-bootstrap中移动到顶部和底部

Question

我想建立一个测试网站。它包含3个div。 一个div应位于左侧，另一个div位于右侧。如果我调整浏览器的大小，则右侧div的最高位置应移至顶部，最低位置应移至底部。

这是大型浏览器的外观：

<div class="col-lg-6 highlight" style="height:50%;">1</div>
<div class="col-lg-6 highlight" style="height:25%;">2</div>
<div class="col-lg-6 highlight" style="height:25%;">3</div>

但是如果我调整浏览器的大小，顺序是1 - 2 - 3.我想要2 - 1 - 3。

它应该是这样的。该代码适用于移动设备：

<div class="col-lg-6 highlight col-lg-push-6" style="height:25%;">2</div>
<div class="col-lg-6  highlight col-lg-pull-6" style="height:50%;">1</div>
<div class="col-lg-6 highlight col-lg-push-6" style="height:25%;">3</div>

但如果我将浏览器窗口调整为大，则会出现间隙。

如果我将1向左浮动而其他向右浮动并在大型浏览器中删除css属性，则它可以正常工作。但纯引导是否可能？

Answer 1

你可以使用向右或向左左侧的类向左或向右浮动，就像这样。

UITapGestureRecognizer