Hey there,
I have customised the height of the slideshow and on mobile responsive the slideshow has a big space at the bottom of it, making a good room between it and its button.
Would anyone be able to help me to remove that space on mobile responsive please?
I added a screenshot of it for further details.
Thank you.
Regards,
please share the store url so that i can provide you the solution code.
Hey,
Thank you for being in touch.
https://statuecorp.com/
Hello @lucasgbona
Can you please share store URL?
Hello, Please share the live store URL or Preview link to see this issue.
Hi @lucasgbona
This is Henry from PageFly - Landing Page Builder App
You can try this code by following these steps:
Step 1: Go to Online Store->Theme->Edit code.
Step 2: Search file base.css
Step 3: Paste the below code at bottom of the file → Save
@media (max-width: 767px){
div#Slider-template–16165483151583__slideshow_EYabjn {
height: fit-content !important;
}
.slideshow__text-wrapper.banner__content.banner__content–middle-center.page-width.banner–desktop-transparent {
display: none;
}}
Hope that my solution works for you.
Best regards,
Henry | PageFly
@lucasgbona please add below code into your theme files instructions below.
Theme Files > edit code > assets > base.css
@media only screen and (max-width: 767px) {
#shopify-section-template--16165483151583__slideshow_EYabjn .banner--adapt_image {
height: auto !important;
}
}
In addition, I noticed that this section on the home page is wider than other sections. I think you should align the sections together.
Hi,
I got half of the space gone but there’s still a space as high as the banner.
Could it be fixed, too?
Thank you
@media only screen and (max-width: 767px) {
.slideshow__text-wrapper.banner__content.banner__content--middle-center.page-width.banner--desktop-transparent {
display: none;
}
}
please add this code too.
The space has been removed.
Thank you very much.
Please don’t feel hesitate to reach out me if you have any issues.