Bootstrap 3：如何强制列高度相同并将按钮对齐到底部

Question

我有两列包含文本和文本后面的按钮。文本可能很长或相当短，因此列将具有不同的高度。我希望列的高度相同，并对齐底部的按钮。以下是我的HTML的示例：

<div class="container">
  <div class="row">

  <div class="col-sm-6 outer">
    <div class="row">
      <div class="col-sm-6 inner">
        <img src="http://lorempixel.com/400/400" class="img-responsive">
      </div>
      <div class="col-sm-6">
        <h4>Content content content content content</h4>
        <button class="btn btn-default">Text</button>
      </div>
    </div>
  </div>

  <div class="col-sm-6 outer">
    <div class="row">
      <div class="col-sm-6 inner">
        <img src="http://lorempixel.com/400/400" class="img-responsive">
      </div>
      <div class="col-sm-6">
        <h4>Content content content content content content content content content</h4>
        <button class="btn btn-default">Text</button>
      </div>
    </div>
  </div>
 </div>
</div>

直播代码：

http://www.bootply.com/114596

有没有办法在没有Javascript的情况下这样做？

Answer 1

最简单的方法是添加overflow:auto;

<强> CSS

h4{
  height:200px;
  overflow:auto;
}