如何保持响应图像相同的高度？

我正在制作一个网页，其中有一排并排有封面照片和个人资料图片。我将它们都放在不同大小网格的引导行中。但是，个人资料图片总是低于封面照片（它的高度更大）。如何让它们保持响应，但高度相同？我的最终目标是让它们看起来像一条带（之间有填充），然后当窗口大小为移动设备时堆叠。

<div class="row">
                    <div class="col-lg-8">
                    <img src="http://placehold.it/851x315" class="img-responsive" alt="Cover Photo">
                    </div>
                    <div class="col-lg-4">
                    <img src="http://placehold.it/200x200" class="img-responsive" alt="Profile Picture">
                    </div>
                </div>

我尝试限制 row div 的高度，将其设置为特定高度，并将引导网格切换为不同比例的 col-md 或 col-sm 。任何智慧都值得赞赏。

对它们使用最小高度

try

img {
min-height:100%
}

如果这不起作用，请使用固定的最大高度

img {
min-height:4em;
}