小屏幕上的引导列重新排序

Question

我在页面上有以下布局：

代码：

<div class="row">
	<div class="col-xs-12">
		<div class="row">
			<div class="col-md-6 col-xs-12">
				<div class="panel">...//Panel1..</div>
			</div>
			<div class="col-md-6 col-xs-12">
				<div class="panel">...//Panel2..</div>
			</div>
		</div>
		<div class="row">
			<div class="col-md-6 col-xs-12">
				<div class="panel">...//Panel3..</div>
			</div>
			<div class="col-md-6 col-xs-12">
				<div class="panel">...//Panel4..</div>
			</div>
		</div>
	</div>
</div>

在我向面板添加折叠之前一切正常..

现在折叠 Panel1 或 Panel2 后，我有这个效果：

是否可以通过在小屏幕上保持面板顺序来解决此问题？

Answer 1

只需在面板中添加一个通用的min-height，这样无论是否切换，它们都可以保持相同的高度。