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)`


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


You need to login to view comments.