Align Top of Essential Grid

Support
#1

Hi X Team,

I’m building an eCommerce site using X and WooCommerce and working with Essential Grid to display the products. See one of the product groupings…

http://cpap.bluetroop.com/cpap-machines/

Can you please tell me what bit of global code I can add to force the tops of the rows/images to align perfectly? Currently as it is now, because of the various lengths of the title text below the products, it cause a “masonry-type” look to the rows and I would like to have the tops aligned. Is this possible?

Thank you in advance.

#2

Hi there,

Thanks for posting in.

That’s how masonry works, it fills up the gaps and spaces. What you need is Even layout instead of masonry. If you force the height of those items then it will affect the responsiveness of your grid layout.

Though, you may add this CSS to your grid’s custom CSS

    .eg-cpap-products-2-element-0 {
     min-height: 72px !important;   
    }

This doesn’t fix other devices view since it’s responsive. You may enhance it and will become more complex.

Thanks!