Change SVG Colour on Headline Image

[tomr96]

Hi there,

I am using an SVG as my headline graphic and am trying to use CSS to change the colour.

I have checked Chrome and have got the class of the item I would like to change the colour of, but it doesn’t work.

.e473-13 x-image x-graphic-image x-graphic-primary
{
fill: red;
}

See Secure Notes for the details.

Thanks.

[ruenel]

Hello Tom,

Thanks for writing in!

Be advised that your class selector is incorrect. If you have class selectors in an element for example, class1 class-n class-a another-class, in your custom CSS you will have to insert it like this:

.class1.class-n.class-a.another-class {
  // your styling
}

Please check this out: https://css-tricks.com/multiple-class-id-selectors/

By the way, adding an SVG file using the image tag or image field and use custom CSS to fill some color will not work. Kindly check out this article first: https://css-tricks.com/almanac/properties/f/fill/

Best Regards.