Slider size on Mobile

[George]

what coding would I use on theme to make slider smaller on mobile device. The slide descriptions do not show up.

[Sonal S Sinha]

Hi George,

Kindly show us your website URL.

Regards,
Dave

[George]

www.thebutclause.com

[Sonal S Sinha]

Hi George,

Kindly go to Appearance>>Theme Option>>Basic Setting>>Custom CSS Box

Add this code there:

@media (max-width: 767px) {
.theme-default .nivo-controlNav{display: none;}
.slider-main .nivo-caption{padding: 20px 0;}
.slider-main .nivo-caption .slidedesc{display: block !important; margin: 0; padding: 0;}
}

Regards,
Dave

[George]

Dave that fixes the size issue but now I have the description area overalapping the image is there a way to make that transparent?

[Sonal S Sinha]

Hi George,

Replace this code with previous code:

@media (max-width: 767px) {
.theme-default .nivo-controlNav{display: none;}
.slider-main .nivo-caption{padding: 20px 0;}
.slider-main .nivo-caption .slidedesc{background: transparent; display: block !important; margin: 0; padding: 0;}
}

Regards,
Dave

[George]

It looks like I have to change the slider images to make this work. Or maybe change the slider from Nivo to something else

[Author]

Posts