Product Grid display bugs

Hi @andrewkow ,

Hope you’re doing good!
It seems your theme CSS is conflicting with this.

Can you please add this custom CSS on your stylesheet:

.eael-product-grid ul.products li.product {
    width: calc(100% - 14px) !important;
}

Hope this CSS will solve your issue.

You can easily apply custom CSS by following this documentation: https://essential-addons.com/elementor/docs/faq/apply-custom-css-elements/

Let me know how it goes. Thank you.

Hi Abid,

Thanks for the code, it works well! May I know which particular theme CSS conflicting with this?

Will the custom CSS gone when I update the theme?

Cheers

Hi @andrewkow ,

This CSS was conflicting with the EA Product Grid: https://d.pr/i/uBzpCt

From the inspector, I can see that you added the CSS on WordPress Customizer. So your CSS will not be gone with theme/plugin update don’t worry.

Hi Abid,

If that’s the case should I remove the CSS from the screenshot? If so where can I find the CSS? I didn’t find it on the Additional CSS and Custom Simple CSS there.

Hi @andrewkow again,

Since you’re using a caching plugin that minified your CSS in one file, so it’s not possible to say which file contains that CSS.

However, you can’t remove that CSS since that comes from the theme/plugin.

The CSS I provide you only impacts the EA Product Grid widget and fix in your case.

Hope you understand.
Thank you!