Bootstrap列将图像的高度设置为文本的高度

Question

我为自己做了一个2列的行，其中左边一个用文本填充，右边一个用作图像，现在由于图像比文本大，我想将图像缩小到文本的大小，然后使用右拉类来保持图像正确对齐。

这里是我现在有：

<div class="row"> 
    <div class="col-md-6"> 
     // text here 
    </div> 
    <div class="col-md-6"> 
     // image here 
    </div> 
</div> 

出于某种原因，我不能自举C​​SS添加到的jsfiddle，所以我不能显示输出，但我可以尝试解释图像，右列其中是比左文本列更大，所以我想，图像与文本列高度

我希望这是有道理的

Answer 1

我认为像这样规模...... DEMO

这需要高度尺寸从COL-MD-8类，并把它分配给图片...

function checkWidth() { 
var a=$('.col-md-8').height(); 
$('img').height(a); 
} 
checkWidth(); 
// Bind event listener 
$(window).resize(checkWidth); 

HTML部分：

<div class="row"> 
     <div class="col-md-8 col-sm-8 col-xs-8"> 
      <p>Lots here...With tof text he four tiers of grids available you'e bound to run into issues where, at certain breakpoints, your columns don't clear quite right as one is taller than the other. To fix that, use a combination of a .clearfix and o</p> 
     </div> 
     <div class="col-md-4 col-sm-4 col-xs-4"> 
      <div class="imgAbt"> 
       <img class="img-responsive" src="http://icons.iconarchive.com/icons/mazenl77/I-like-buttons-3a/512/Cute-Ball-Go-icon.png" /> 
      </div> 
     </div> 
    </div> 
</div> 
<div class="row"> 
     <div class="col-md-8 col-sm-8 col-xs-8"> 
      <p>Lots of text here...Wi8h the four tiers of grids available you're bound to run into issues where, at certain breakpoints, your columns don't clear quite right as one is taller than the other. To fix that, use a combination of a .clearfix and o</p> 
     </div> 
     <div class="col-md-4 col-sm-4 col-xs-4"> 
      <div class="imgAbt"> 
       <img class="img-responsive" src="http://icons.iconarchive.com/icons/mazenl77/I-like-buttons-3a/512/Cute-Ball-Go-icon.png" /> 
      </div> 
     </div> 
    </div> 
</div>