Advanced Search

Make all elements/columns/containers/boxes the same height

/ Published in: JavaScript
Save to your folder(s)
This allows you to set any number of elements to the same height. Took it from filamentgroup.com, so credit goes to them. Just putting it here so I can access it at any time.

Usage: `$('.columns').equalHeights(minHeight, maxHeight)`

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. (function($) {
  2.     $.fn.equalHeights = function(minHeight, maxHeight) {
  3.         tallest = (minHeight) ? minHeight : 0;
  4.         this.each(function() {
  5.             if($(this).height() > tallest) {
  6.                 tallest = $(this).height();
  7.             }
  8.         });
  9.         if((maxHeight) && tallest > maxHeight) tallest = maxHeight;
  10.         return this.each(function() {
  11.             $(this).height(tallest).css("overflow","auto");
  12.         });
  13.     }
  14. })(jQuery);

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.