Hi,

I am using two carousel in a screen. But for one carousel navigation icon color has to different from another carousel.

Can anyone help me for this?

Hi Vitheya,

1.In chrome browser(assuming) inspect that element and try to change the color of it.

If it is changed then copy the CSS and put in that page's CSS.

2. You can use the extended property of that element and change the color.


Hope this will help you.


Regards,

Amreen


Amreen Shaikh wrote:

Hi Vitheya,

1.In chrome browser(assuming) inspect that element and try to change the color of it.

If it is changed then copy the CSS and put in that page's CSS.

2. You can use the extended property of that element and change the color.


Hope this will help you.


Regards,

Amreen


If i change the css, it reflects for both the carousel.

for carousel i cant find the extended property.


Solution

Vitheya S wrote:

Amreen Shaikh wrote:

Hi Vitheya,

1.In chrome browser(assuming) inspect that element and try to change the color of it.

If it is changed then copy the CSS and put in that page's CSS.

2. You can use the extended property of that element and change the color.


Hope this will help you.


Regards,

Amreen


If i change the css, it reflects for both the carousel.

for carousel i cant find the extended property.


Hi,

Please put that carousel in a container and apply 

SyntaxEditor Code Snippet

.C1 .carousel .carousel-dots-container .carousel-dot {
    background-color: #455AED;
   
}

Repeat this for the second carousel with a different color.

Please find the .oml for demo


Hope this will help you.


Regards,

Amreen

Solution

Amreen Shaikh wrote:

Vitheya S wrote:

Amreen Shaikh wrote:

Hi Vitheya,

1.In chrome browser(assuming) inspect that element and try to change the color of it.

If it is changed then copy the CSS and put in that page's CSS.

2. You can use the extended property of that element and change the color.


Hope this will help you.


Regards,

Amreen


If i change the css, it reflects for both the carousel.

for carousel i cant find the extended property.


Hi,

Please put that carousel in a container and apply 

SyntaxEditor Code Snippet

.C1 .carousel .carousel-dots-container .carousel-dot {
    background-color: #455AED;
   
}

Repeat this for the second carousel with a different color.

Please find the .oml for demo


Hope this will help you.


Regards,

Amreen

Thank you so much. It worked.