Equal column height via flex-box

[hivehouse]

Referencing this post: https://theme.co/apex/forum/t/equal-column-height/721/2

From a previous support email, I received this JS but really would like to implement in flex-box, leveraging stretch. I was looking to implement it on promo and box-grid elements.

jQuery(document).ready(function($) {
var max_height = 0  
$('.x-section .x-container').each(function(){

$(this).children().children().children('.x-promo-content').each(function(){
   var current_height = $(this).height();
   if(current_height > max_height){
      max_height = current_height;
   }
});
$(this).children().children().children('.x-promo-content').height(max_height);

});

var max_height_bg = 0  
$('.x-block-grid-item').each(function(){
var current_height_bg = $(this).height();
if(current_height_bg > max_height_bg){
max_height_bg = current_height_bg;
}
 $(this).height(max_height_bg);     
 });


});

Thanks

[lely]

Hi There,

Thanks for writing in! Regretfully, this particular customization request is possible with more customization that is beyond the scope of our support. Each element has different structure thus one code that will work for each elements that will give them equal heights require complex solutions. Each of those elements has different levels of child elements where we need to add equal heights… As such, you will need to investigate this particular issue on your own or seek help from a developer should you not feel comfortable making these changes yourself. We do have an in-house custom development team that offer paid services, who may be able to assist. They can be contacted at [email protected] if this is of interest to you. If you have any further questions about the theme, we are more than happy to provide you with assistance on these inquiries.

Thank you for your understanding.