A space to discuss online store customization, theme development, and Liquid templating.
I'm working on a website where portrait style images are used instead of landscape in my slider so it looks a bit wonky. Gray areas fill in that empty space behind (the slider is set to grid instead of full width layout). How do I change this gray to white or transparent some how?
I do have this custom css in it already to be able to see the whole portrait image without it taking up the entire screen.
.media > img {
object-fit: contain;
}
Solved! Go to the solution
This is an accepted solution.
Hi @consultancy_hrv,
Can you try to add this CSS
Go to Online store > theme > customize > setting > custom css
.slideshow__media.banner__media.media {
background: none;
}
Hope this helps, and if you need further help, don't hesitate to comment and let us know
Hi, it is quite hard to imagine what you are describing. Can you give us your website (and password if any)?
And we will try to come back with a solution to your problem.
Yup. At the bottom of this page is the slideshow. https://woodyshoodies.ca/pages/the-story
The gray space behind is super frustrating
This is an accepted solution.
Hi @consultancy_hrv,
Can you try to add this CSS
Go to Online store > theme > customize > setting > custom css
.slideshow__media.banner__media.media {
background: none;
}
Hope this helps, and if you need further help, don't hesitate to comment and let us know
Thank you! I applied it as custom css to the whole site rather than just the component and it worked 🙂