Slideshow banners not resizing to mobile on Brooklyn Theme

Solved
GYGYB
Tourist
18 1 2

Hi

Can anyone please tell me why my slideshow banners are not resizing to mobile on my Brooklyn theme?

The url for my website is https://mummy-gummies.com/

Thank you in advance for any help!

Claire :))

0 Likes
paramSoft
Shopify Partner
1454 236 645

Please place this code at the end of theme.scss
Please make the 'm' of media small.

@_media only screen and (max-width: 600px) {
  #Slideshow-slideshow {
    background-color: #ffffff;
}
.slideshow__image {
    object-fit: contain;
    -o-object-fit: contain;
}
}


 

Want to customize Shopify storefront? Check the PageFly app
75,000+ Active Shopify merchants. TOP5 best Shopify Apps.

Contact Me On : parambabla.soft@gmail.com
GYGYB
Tourist
18 1 2

Thank you for that, I have inserted the code however I have a huge blank space at the top and below the banner.  Is there anyway to get rid of these gaps?

Thank you

Claire :))

0 Likes
paramSoft
Shopify Partner
1454 236 645

This is an accepted solution.

Please add this code  also.
Please make the 'm' of media small.

@_media only screen and (max-width: 749px) {
.slideshow--adapt .slideshow {
    min-height: 42vw;
}
}
Want to customize Shopify storefront? Check the PageFly app
75,000+ Active Shopify merchants. TOP5 best Shopify Apps.

Contact Me On : parambabla.soft@gmail.com
GYGYB
Tourist
18 1 2

 That is much better!

Thanks so much for your help!

Claire

 

0 Likes
paramSoft
Shopify Partner
1454 236 645

Thank you for update.

Want to customize Shopify storefront? Check the PageFly app
75,000+ Active Shopify merchants. TOP5 best Shopify Apps.

Contact Me On : parambabla.soft@gmail.com
0 Likes