사업부 표 레이아웃 같은 높이

Question

내가 부트 스트랩에 레이아웃을하고 있어요, 내 CSS는 (배경 색 디버깅을위한 설정) 다음과 같습니다 세포 :

<div class="row" style="display: table; width: 100%; height: 100%; background-color: red;"> 
    <div class="col-md-8" style="display: table-cell; height: 100%; background-color: blue;"> 
     <textarea id="events-text" class="form-control" style="height: 100%;"></textarea> 
    </div> 
    <div class="col-md-4" style="display: table-cell;"> 
     <div class="btn-group-vertical" style="width: 100%;"> 
      {% for category in categories %} 
      <button class="btn btn-default btn-xs category-select"> 
       {{ category.name }} 
      </button> 
      {% endfor %} 
     </div> 
    </div> 
</div> 

그리고 효과는 다음과 같습니다

텍스트 영역이 오른쪽의 버튼과 같은 높이가되게하고 싶습니다. 문제는 테이블 셀이 전체 높이가되지 않아 텍스트 영역을 벗어나지 않는다는 것입니다. 이 테이블 셀을 어떻게 오른쪽의 것과 동일한 높이로 만들 수 있습니까?

Answer 1

나는 당신이 table-cell에 수레를 제거 할 필요가 있다고 생각 (플로트 : 부트 스트랩에 의해 추가되는 왼쪽) ..

http://www.bootply.com/116934