为什么我不能离开div高度是相同的权利div

Question

在bootstrap中，我创建了两个div inline。

在正确的div我有图像的属性宽度：100％，现在我的问题是 左div，我想设置他的高度相同的div col-sm-9，如何做 那。

是的简单方法是为col-sm-3和col-sm-9设置相同的高度，但对于图像而言它的语义不是 。计算col-sm-9 的高度并将其设置为col-sm-3可以吗？

http://jsfiddle.net/gdxvy575/

HTML

<div class="container"> 
     <div class="row"> 
      <div class="col-sm-3"> 
       <h2>This is title</h2> 
       <p>Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci </p> 

      </div> 
      <div class="col-sm-9"> 
       <img src="http://eibach.com/sites/eibach.com.m-global/files/pictures/project_cars/eibach_projektfahrzeug_vw_scirocco_1024x768_1.jpg" alt=""/> 
      </div> 
     </div> 
    </div> 

CSS

.col-sm-3{ 
     height:100%; 
     background-color:blue; 
     color:white; 
     font-weight:300; 
    } 
    .col-sm-9 img{ 
     width:100%; 
    } 

Answer 1

HI现在用于显示属性tabel-cell作为这样

.col-sm-9, .col-sm-3{display:table-cell;vertical-align:top;float:none;} 

Demo Link

Answer 2

我已经更新这里的小提琴

Fiddle

var imgHeight = $('.col-sm-9 img').height(); 
 
$('.col-sm-3').css("height", imgHeight);

.col-sm-3{ 
 
    height:100%; 
 
    background-color:blue; 
 
    color:white; 
 
    font-weight:300; 
 
} 
 
.col-sm-9 img{ 
 
    width:100%; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="container"> 
 
    <div class="row"> 
 
     <div class="col-sm-3"> 
 
      <h2>This is title</h2> 
 
      <p>Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci </p> 
 

 
     </div> 
 
     <div class="col-sm-9"> 
 
      <img src="http://eibach.com/sites/eibach.com.m-global/files/pictures/project_cars/eibach_projektfahrzeug_vw_scirocco_1024x768_1.jpg" alt=""/> 
 
     </div> 
 
    </div> 
 
</div>

试试这个