Different colored carousel indicators

I’ve learned from a thread here entitled “Carousel Indicator” that you can remove arrows or indicators from a carousel by making a subclass and then setting position–> display --> “none”

But I have some carousels on the same page that need white indicators and some that need dark indicators. Can someone explain how to do that?

The best work around I’ve found so far is to color all indicators an intermediate color (like blue).

Thanks,

Hi Tony,

I’d like to do exactly what you did: colour all the indicators in a certain colour. But when I edit the subclass .carousel-control-next and apply a colour, the whole clickable area is coloured. I’d like just the arrow to be coloured. Any idea how to achieve this?

Thanks!

Does anyone know the answer to this? I’m attempting the same.

@mbacon
You can do it a couple of ways. You can target the class using the ID of the Carousel in the CSS
Note the space between classes.

#myCarouselID .carousel-control-next 

You can do something similar with Custom classes on a parent DIV.