How to fix card height issue

[endjarwal]

Hello - I tried this fix from this post: Level Cards to Same Height

But it’s not working for me on my site for some reason. I need help making the cards uniform and make them fade. I cannot figure out how to make it all work.

[tristup]

Hi Endre,

Thanks for reaching out.
The code given in the reference thread has given based on the structure of the site specified there, that may not match with your site structure. That’s why it is not working at your end.
I have gone through your site and used the proper selector to work with the same code, please find the code below and add to Theme Options > JS

jQuery(document).ready(function($){	
        var max=0;
        jQuery(".home .x-card").each(function(index, el) {
            console.log( jQuery(el).height() );
        
            if( jQuery(el).height() > max ){
                max = jQuery(el).height();
            }
        });
        jQuery(".home .x-card").css('height', max);
});

Remember that the above code will work if copied as it is and don’t conflict with any existing style.
Please note that the code provided serves only as a guide to help you get started custom coding on your own if there’s no option offered in our theme or the products we bundle.
We do not provide support for custom codes that means we can’t fix it in case it conflicts with something on your site nor will we enhance it.

Thanks

[endjarwal]

@tristup

jQuery(document).ready(function($){	
        var max=0;
        jQuery(".home .x-card").each(function(index, el) {
            console.log( jQuery(el).height() );
        
            if( jQuery(el).height() > max ){
                max = jQuery(el).height();
            }
        });
        jQuery(".home .x-card").css('height', max);
});

That worked - thank you. Only thing I can’t figure out now is why the text isn’t centered in the boxes. I tried to use CSS but it’s not working.

[prakash_s]

Hello Endre,

It seems that you have added custom HTML H3 tag in Card element Front content text editor. Now you need to edit the Front content text and set text alignment as the centre.

Thanks

[endjarwal]

Oh duh - that makes total sense. Thank you!!!

[prakash_s]

Hello Endre,

Glad that we are able to help you

Have a great day!
Thanks