Perhaps a simple CSS question

I just completed the Data Visualization Scatter Plot project but have one CSS issue that’s bothering me: I can’t get the text in my legend to change color.

The project is at: https://codepen.io/tpmc123/pen/QVxZdw?editors=1111

And here’s a screen grab, showing the problem.

I’m able to control the font-family and font-size of said text, but not the color. I included color: white; in :root, and it changed the rest of the text’s color. I’ve also tried specifying color: white by class and id. No luck.

Any idea what’s going on here?

Get rid of the .attr(“style”, “white”) on both of the legend text elements and just modify your CSS .legend-text class to use the fill property instead of color property.

Since you’re using SVG elements, you cannot style it like a regular text. You can use .style("fill", "white"); or style it on CSS with fill property as Randell mentioned.

Thx @RandellDawson, @DriftingSteps. That did the trick.