You are here:
Adobe Apollo Adobe Apollo

Setting Equal Heights using JQuery

I recently ran into a problem of trying to align the height of 2 columns (col-left and col-right). I know this can be achieved using CSS in most circumstances and I would always advise this path or solution to the problem. However just CSS this time, was not going to get the job done. Luckily the nice people at Filament Group, have provided an example of how to set the heights of the elements equally using a nice little JQuery function called equalHeights.

equalHeights loops through the top-level child nodes of a specified element and sets their min-height values to that of the tallest. It’s set up as a standard JQuery plugin, and is called on the container element:

$('.selectorClass').equalHeights();

It's a very handy plugin and helped me. Enjoy!