twitter-bootstrap - 使用 twitter bootstrap，如何让缩略图（如缩略图组件）具有相同的高度？

Question

您可以在这里看到http://twitter.github.com/bootstrap/components.html#thumbnails在示例中带有标题和描述，如果一个单元格的标题或描述比另一个短得多或长得多，块的整个高度将相应地减少或增加。

如何使这些块具有相同的高度？

我尝试display: table-row在ul, 和类display: table-cell上进行设置.thumbnail，但不幸的是，这完全破坏了布局的响应能力：块内的图像高度和宽度不再自动调整大小。

更新：在 jsfiddle http://jsfiddle.net/kwBuW/7/上设置问题的演示

Answer 1

也许您可以修复具有缩略图类的高度 div。喜欢：

<div class="thumbnail" style="height: 400px;">

如果您希望每个内容都具有相同的高度，我认为您必须编写一个 JavaScript 来修复它，当然，在 DOM 准备好之后。喜欢：

var max = 0, jThumbnails = $("ul.gallery div.thumbnail");
jThumbnails .each(function(index, elt){
    max = Math.max(max, $(elt).height());
});
jThumbnails.setHeight(max);