[Support request] Shop overview on page category columns are too narrow (only on mobile)

[Marielle]

Hi,

On are website there seems to be a problem with the display of category images and description. They are very narrow, no matter what I choose as number of product in column of rows. This is fine on desktop, the problem is on mobile only.
See attached the view on mobile.

It’s probably a plugin that causes it but it’s difficult to simulate on mobile view (the mobile example shown is correct, just not on a live mobile)

Any suggestions?

Kind regards,
Marielle

[David]

Hi there,

go to Customizer > Layout > Wocoommerce and set the Columns to 1
Otherwise you have Elementor and GP trying to set the columns

[Marielle]

Hi David,

Thanks. It does not seem to respond in those settings to 1 column (Customizer > Layout > Wocoommerce). Seems to be overruled by some other plugin. Anything else I could try?

Kind regards, Marielle

[David]

So the CSS affecting it is coming from the Woocommerce plugin:

You can see it applying it 48% width, which is using more specific CSS then what Elementor is doing with its width: auto;

You should speak to Elementor about how to fix this. There may be a setting or something that needs changing.

In the meantime you can try adding some CSS to get around it:

.elementor-products-grid ul.products.elementor-grid li.product {
    width: auto !important;
}

[Marielle]

Okay thank you I will contact them!

[David]

You’re welcome

[Author]

Posts