Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

CSS overrides not working

See original GitHub issue

C3 version: 0.4.22
D3 version: 3.5.17
Browser: Chrome
OS: Windows 10

From my research, I see that I should be able to override CSS attributes of parts of C3 graphs by using the right class names. Though I can’t find a guide of all c3 CSS classes that can be overrided, I’ve found the following examples that don’t seem to actually override:

in #1744 I should be able to change main label color with

.c3-chart-arc {
    fill: white !important;
}

from my own dom inspection, I figured I should be able to set chart label (labels: true attribute) color using

.c3-chart-texts {
    fill: black !important;
}

in #101 and #808 we should be able to set the line thickness using

.c3-line {
    stroke-width: 3px;
}

None of these things are working, even with the !important attribute set on the css class. Is this still supported? bitmoji

Issue Analytics

State:
Created 5 years ago
Reactions:1
Comments:10 (1 by maintainers)

Top GitHub Comments

2reactions

NaiLicommented, Apr 20, 2018

I seem to have the same problem. Any solution found?

1reaction

robertofabrizicommented, Mar 28, 2018

C3 version: c3-0.5.1 D3 version: d3-4.13.0 Browser: Chrome OS: Windows 10

Some CSS overrides are working for me, for example this works: .c3-arcs { fill: red !important; stroke: red !important; color:red !important; } but this one definitely doesn’t: .c3-chart-arcs-background { fill: red !important; stroke: red !important; color: red !important; } If I roll back to c3-0.4.21 (and d3 to 3x) it works just fine.

Top Results From Across the Web

Custom Class Not Overriding Other CSS - html - Stack Overflow

You have to add the class before the element to specify under what circumstances which item is being selected. Thus

Css override not working - OutSystems

Hello,. I'm trying to override (display: inline-block; ) in Basic.css file by creating a class in my own css file:

How to fix style override issues - EventON - Documentation

Step 3: Write a CSS style to override this issue. Get the class name of the style that is overridden in EventON (in...

How to Override CSS Styles - W3docs

Example of overriding CSS style with the ID selector: It's only applicable if both the ID and the Class are used in the...

Local Overrides Not Working - Google Groups

Configure (enable) Local Overrides. From DevTools > Network panel, right click on webpage1. html and select 'Save for overrides' (only showing up for...