BlueOwlCreative » Topic: Image Carousel

Image Carousel

esgoddard — Fri, 08 Jul 2016 09:20:29 +0000

Hi I am using an image carousel on my homepage and when it is viewed on mobile the arrows to scroll through it are cut off at the sides so you can’t use it properly. How can I fix this please?

Reply To: Image Carousel

esgoddard — Fri, 08 Jul 2016 09:20:52 +0000

This reply has been marked as private.

Reply To: Image Carousel

BlueOwl — Fri, 08 Jul 2016 12:08:12 +0000

Hey, try this:

@media only screen and (max-width: 768px) {
.img_carousel_holder.owl_side_arrows .owl-theme .owl-next {
    right: -50px;
}
.img_carousel_holder.owl_side_arrows .owl-theme .owl-prev {
    left: -50px;
}
}

Reply To: Image Carousel

esgoddard — Fri, 08 Jul 2016 12:20:46 +0000

I think it’s better but still not enough – I can see about 70% of the arrows. How can I adjust that code to make them 100% visible? Many thanks!

Reply To: Image Carousel

BlueOwl — Fri, 08 Jul 2016 14:44:40 +0000

@media only screen and (max-width: 768px) {
.img_carousel_holder.owl_side_arrows .owl-theme .owl-next {
    right: -30px;
}
.img_carousel_holder.owl_side_arrows .owl-theme .owl-prev {
    left: -30px;
}
}

Reply To: Image Carousel

esgoddard — Sat, 09 Jul 2016 09:55:06 +0000

That’s great, thanks