SVG: why does external css override inline style for text?

Question

I\'m playing with using an SVG gradientFill as a way to visually \'truncate\' long text strings in a d3.js chart.

It seems that an external css style for fill will o

Answer 1

Because in SVG, like HTML before it, styles trump attribute styling.

fill="red" below is NOT an "inline style", style="fill:green" IS an inline style.

Like wise, if you have a style defined outside, it will win.