jquery - Set a DIV height equal with of another DIV

Question

I have two DIVs, .sidebar and .content and I want to set .sidebar to keep the same height with the .content.

I've tried the following:

$(".sidebar").css({'height':($(".content").height()+'px'});

$(".sidebar").height($(".content").height());

var highestCol = Math.max($('.sidebar').height(),$('.content').height());
$('.sidebar').height(highestCol);

None of these are working. For the .content I don't have any height since will increase or decrease based on the content.

Please help me. I have to finish up a web page today and this (simple) thing is giving me headaches.

Thank you!

Answer 1

The reason your first example isn't working is because of a typo:

$(".sidebar").css({'height':($(".content").height()+'px'});

should actually be

$(".sidebar").css({'height':($(".content").height()+'px')});

you're missing a trailing bracket from before the .content selector.