JS to Make Cols Equal Height - Text Overflow Issue

The JS reference below works well, however, is there a way to have it recalculate the height needed for the column as the screen adjusts sizes? I’ve noticed that the text will start to overflow the column when I get to the smaller breakpoints.

Or is there a way to use calc for the height on the column?

This is the original reference post:

Hi There,

Please update the custom JS to this:

jQuery(document).ready(function($) { 
	function equal_height(){
		var max = 0; 
		$("#x-section-4 .x-column").each(function(index, el) { 
			if( $(this).height() > max ){ 
				max = $(this).height(); 
			}
		}); 
		$("#x-section-4 .x-column").css('height', max); 
	}
	equal_height();
	$(window).on('resize',function(){
		equal_height();
	});
});

Don’t forget to change your section ID.

Regards!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.