How to Make Image Slideshow Mobile Responsive

[averyjo98]

I’m working on a client site, and she wants to have customer reviews/testimonials on the homepage as a slideshow. As you can see on Desktop this is fine. This is the site I’m working on https://lazylittleleopard.com/

But on mobile the text gets pushed down to the bottom of the purple banner. I’d like the text to stay inside the purple image container when it’s on a mobile device, so that the banner looks consistent on all devices. This is what it currently looks like on mobile. As you can see, since the white text is on a white background, no one can read it.

Any help is appreciated. Thank you!

[PageFly-Oliver]

Hi @averyjo98 ,

You can try this code by following these steps:

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file section-image-banner.css

Step 3: Paste the below code at the bottom of the file → Save

@media(max-width:767px){
.slideshow__media.banner__media.media{
position:absolute !important
}
}

Hope my solution works perfectly for you!

Best regards,

Oliver | PageFly