Bootstrap 3 - 如何以较小的分辨率正确对齐列？

Question

我使用带有Bootstrap 3的 col-sm-6 以较小的分辨率创建一列2列。有些列比其他列长。由于我连续有4列，这里是我想要的一个例子：

当所有行都具有（近似）等长时，它可以正常工作。

但是，让我们说我的第一列包含更多文本，并且比其他列更长，这就是我得到的：

有没有人知道这个问题的解决方案？我还在这里放置了一个工作示例：

http://www.bootply.com/SD1Cc4qmrS

Answer 1

这是一个常见问题！以下是文档中的首选解决方案：http://getbootstrap.com/css/#grid-responsive-resets

这里它适用于你的例子。 http://www.bootply.com/6nJK9XpSge

Answer 2

试试这个：

<div class="row">

  <div class="row">
    <div class="col-md-3 col-sm-6">
    <div class="border">Col 1: Long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text long text</div>
    </div>
    <div class="col-md-3 col-sm-6">
    <div class="border">Col 2: Short text</div>
     </div>
  </div>

  <div class="col-md-3 col-sm-6">
    <div class="border">Col 3: Short text</div>
  </div>
  <div class="col-md-3 col-sm-6">
    <div class="border">Col 4: Short text</div>
  </div>
</div>