부트 스트랩 3 : 열을 동일한 높이로하고 단추를 아래쪽으로 정렬하려면 어떻게합니까?

Question

텍스트 뒤에 텍스트와 단추가 포함 된 두 개의 열이 있습니다. 텍스트가 상당히 길거나 짧을 수 있으므로 열의 높이가 달라집니다. 기둥이 같은 높이가되도록하고 하단의 단추를 맞 춥니 다.

<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

자바 스크립트없이이 일을 어떤 방법이 여기 내 HTML의 모습의 샘플입니다?

Answer 1

그 작업을 수행하는 가장 쉬운 방법은 overflow:auto;

CSS를

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