Viktor Viktor - 1 month ago 19
HTML Question

css class override with style html snippet

Hi I am using a CMS (content management system) that uses CSS to color the buttons and menu items.

I used Firefox developer to inspect the element and the button is labeled

<span class="cta-button cta-icon-left cta-custom-color-0 cta-button-medium cta-button-nomocaption cta-button-nomosubcaption cta-button-nomoicon">


I believe 'cta-custom-color-0' is where the color is contained for the button.

I tried adding the following HTML snippet to the page

<style>
.cta-custom-color-0 {background-color: #8640a8;}
</style>


However it isn't changing the button color.

What is the correct CSS syntax to override the color with a style snippet?

see Send to Google Maps Button here on sample page

Answer

Like commenters have said you need to use you browser's developer tools, and find the element of interest.

Turns out you are trying to set the color of a wrapper, but the actual black color comes from an inner element with class .cta-body.cta-normal

So I believe you would need:

.cta-body.cta-normal {background-color: #8640a8;}

enter image description here

enter image description here