Version 7.0: Make Slideshow:Simple appear as 1600 pixels wide on desktop and as stacked on mobile

Hi There.

I am trying to make a home landing page with a slideshow for my website that appears as a 1600 pixels wide Slideshow on Desktop and switches to a Stacked view on mobile.

Thanks in advance!

Hi,

Add to Design > Custom CSS

/* Gallery slideshow to stacked */
@media screen and (max-width:767px) {
.gallery-slideshow-item-img.content-fit {
    opacity: 1 !important;
}
figure.gallery-slideshow-item {
    position: relative !important;
    visibility: visible !important;
}
.gallery-slideshow {
    height: auto !important;
}
.gallery-slideshow-wrapper {
    height: 100% !important;
}
.gallery-slideshow-list {
    position: static !important;
}
.gallery-slideshow-item img {
    position: static !important;
    visibility: visible !important;
}
.gallery-slideshow-controls {
    display: none !important;
}}

@tuanphan

I've copied and pasted the code onto my Custom CSS tab but it didn't work.

Do you know what the problem might be?

Thank you!

On 4/18/2023 at 12:38 AM, GMB1 said:

@tuanphan

I've copied and pasted the code onto my Custom CSS tab but it didn't work.

Do you know what the problem might be?

 

Thank you!

What is site url?