Changing colour of Xref in a DIV via CSS

[JLWilson]

I've created a specific DIV and want to change the colour of the Xref (just for this DIV) via the CSS.

I've tried editing the div in the mainstyles.css in notepad and adding in the following line:

MadCap|xref-color: #FFFFFF;

But it is still showing as the default colour, I did create a new style class - MadCap|xref.Xref_alt, but obviously don't want to apply this manually each time.

Any pearls of wisdom please?
Thanks

[NorthEast]

First, I'd suggest learning a bit more about CSS if you're going to edit it by hand - this summary is a handy reference:
https://www.w3schools.com/cssref/css_selectors.asp

You might try something like:

Code: Select all

div.something a.xref
{
   color: red;
}

Note that we can't use div.something MadCap|xref {}, as Flare doesn't handle any MadCap| tags used in complex CSS selectors.

The MadCap| styles exist in the source only, and when the output is built they're converted to real tags. So we have to reference the output tag; e.g. MadCap|xref will be generated as an a.xref tag.

[JLWilson]

Great -thanks, I guess I was over complicating!