4

http://twitter.github.com/bootstrap/components.html#thumbnailsの例では、タイトルと説明が表示されます。一方のセルのタイトルまたは説明がもう一方のセルよりもはるかに短いか長い場合は、ブロック全体の高さは、それに応じて減少または増加します。

これらのブロックを同じ高さにするにはどうすればよいですか?

とクラスで設定display: table-rowしてみましたが、残念ながら、これによりレイアウトの応答性が完全に損なわれました。ブロック内の画像の高さと幅が自動的にサイズ変更されなくなりました。uldisplay: table-cell.thumbnail

更新:jsfiddlehttp://jsfiddle.net/kwBuW/7/で問題のデモを設定します

4

1 に答える 1

4

サムネイルクラスを持つ高さdivを修正できるかもしれません。好き:

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

すべてのコンテンツに同じ高さが必要な場合は、もちろんDOMの準備ができた後、それを修正するJavaScriptを作成する必要があると思います。好き:

var max = 0, jThumbnails = $("ul.gallery div.thumbnail");
jThumbnails .each(function(index, elt){
    max = Math.max(max, $(elt).height());
});
jThumbnails.setHeight(max);
于 2012-10-16T11:32:34.113 に答える