html - 使元素高度相同

Question

在这个页面的底部，我展示了一个 YouTube 视频、Twitter 提要和一个类似的节日轮播并排在一起。

我想让 YouTube 视频和类似节日的内容与 Twitter 提要的高度相同，以填充红色显示的空间，但我似乎不知道如何使它们更高。

Answer 1

您必须捕获最高 div 的高度，并将其应用于其他 div。这只能使用 javascript 并在 dom 完全加载后完成。例如，使用 jQuery 之类的东西很容易。

最好的办法是给所有需要相同高度的 div 和相同的类名，例如“fixthis”。运行到每个 div 以捕获高度并将此高度应用于所有：

$(函数(){

var new_height = 0;

$('.fixthis').each(function(){

    if($(this).height() > new_height) new_height = $(this).height();

}).height(new_height);

});

在您的情况下，YouTube 面板具有“youtube”类，因此您可以从这里开始查找其他面板：

$(函数(){

var new_height = 0;

$('.youtube').parent().find('> div').each(function(){

    if($(this).height() > new_height) new_height = $(this).height();

}).height(new_height);

});