I’ve created several Nectar Sliders that appear on different pages of my clients website. The look fine on a desktop, however when viewed on mobile devices (phone & tablet) the arrow navigation is offset to the right. This is more noticeable on a phone as the arrow sits on top of the text. Any ideas how I can fix this?
Add this into the Custom CSS box located in your Salient Options panel (Make Sure there are no red cross in the Box) :
@media only screen and (max-width: 690px) {
.nectar-slider-wrap[data-button-styling="btn_with_preview"] .swiper-container .slider-prev i, .nectar-slider-wrap[data-overall_style="directional"] .swiper-container .slider-prev i {
left: -12px!important;
}
}
I’ve created several Nectar Sliders that appear on different pages of my clients website. The look fine on a desktop, however when viewed on mobile devices (phone & tablet) the arrow navigation is offset to the right. This is more noticeable on a phone as the arrow sits on top of the text. Any ideas how I can fix this?
Hey Mike,
Add this into the Custom CSS box located in your Salient Options panel (Make Sure there are no red cross in the Box) :
@media only screen and (max-width: 690px) { .nectar-slider-wrap[data-button-styling="btn_with_preview"] .swiper-container .slider-prev i, .nectar-slider-wrap[data-overall_style="directional"] .swiper-container .slider-prev i { left: -12px!important; } }Thanks
ThemeNectar Support Team
Thanks – that worked perfectly. And WOW – what a response time… I’m impressed.