Product gallery images displayed in vertical list

Rotosound

I hope that someone can help because this is driving me crazy!

It seems that BeTheme is overriding the style of my Product Gallery widget from Elementor and is causing the images to display in a vertical list rather than as thumbnails inline.

Affect page example: https://www.rotosound.com/product/bh-m-gr/

How I expect it to look: https://www.rotosound.com/wp-content/uploads/2021/08/Screenshot-2021-08-13-at-11.19.58.png

Deactivating plugins doesn't work but changing the theme to "Twenty Twenty One" lets the images display as expected so I believe that this is a conflict with BeTheme.

I have selected the option of "Wordpress Editor - Muffin Builder" but this hasn't solved anything. I've also combed through the code using DevTools comparing the page with different themes but can't find where the issue lies.

I should add that I am loading these elements from an Elementor Single Product template and the product gallery images are loaded via the Elementor "Product Images" widget.

Anyone else experienced this or know how to make this behave normally?

Phil

Hey,

Please send us WordPress dashboard access privately thru the contact form, which is on the right side at http://themeforest.net/user/muffingroup#contact, and we will check what might be the reason.

Notice!

Please attach a link to this forum discussion.

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

Phil

It seems to be an issue with Betheme, as you noticed. We will take a closer look at it.

For now, please, use the following CSS code:

.woocommerce-product-gallery ol{
    list-style: none!important;
}
.woocommerce-product-gallery ol li{
    max-width: 33.3%!important;
    display: inline-block!important;
}

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

Rotosound

This is an embed external element. It can be deleted using the delete key or the backspace key. To view the full element, press the preview button below.

PhilAug 16, 2021

It seems to be an issue with Betheme, as you noticed. We will take a closer look at it.

For now, please, use the following CSS code:

.woocommerce-product-gallery ol{
    list-style: none!important;
}
.woocommerce-product-gallery ol li{
    max-width: 33.3%!important;
    display: inline-block!important;
}

Thanks

Thank you for the quick fix!