White gaps between product image and gallery

[MatousKoc]

Hello!

Recently I found out that my store has big white gap between product image, other images and rest of the product page. I use debut theme. Thank you for your help!

Store is here (btw, I also have second store in different language, where the product page is just fine... Thank you!)

[collinsmbaka]

Hi @MatousKoc 

1. In your Shopify Admin go-to online store > themes > actions > edit code
2. Find Asset > theme.scss.liquid or theme.css and paste this at the bottom of the file

.product-single__media {
height: inherit !important;
}

Cheers! 

[MatousKoc]

Hello @collinsmbaka 

thank you for your time and help! It partially worked, but on mobile screen there is still large gap between product gallery. Could you help me with that as well? Thanks!

[collinsmbaka · Accepted solution]

Hi @MatousKoc 

Please add this rule for the mobile

@media only screen and (max-width: 749px) {
.product-single__thumbnails-item-slide {
    height: inherit;
     }
}

Cheers!

[MatousKoc]

Thank you!

[Joe_Jack]

Hello,

First let me say thanks in advance.  I've used a few solutions found here for other issues.  Thanks for that.  Currently I am having the same issue but only on the mobile side.  Viewing on my desktop it displays perfectly.  I have the exact same gap as shown above.  I've tried adding both rules to my Theme.scss.liquid but there has been no change.  Here is a link to one of my product pages:

https://jkproaudio.com/collections/featured-deals-front-page/products/allen-heath-xone-96-analogue-d...

Any help would be much appreciated.