How to make a unique line thinner using NVD3

Tags: javascript,css,css3,d3.js,nvd3.js

Problem :

Good day. I have a Line Chart from NVD3 where there's 4 lines on the chart. I have it populating just fine. However, I would like one of those lines to be thinner than the rest.

When I go to the nvd3.CSS; the group class represents for all the lines so when I change the stoke-width; it does it for all. When I inspected the elements, it shows that each line does have a unique 'series class' but I can't seem to call it right to make the change for a single line. I would like the series-2 in the group to have the thinner stroke-wdith. Any sugguestion?

How do you make a single line thin with respect to its series while making the others the standard group 'stroke-width'?

.nvd3 g.nv-groups path.nv-line { // the group lines that apply to all
  stroke-width: 9px;
}
.nvd3 g.nv-groups path.nv-series-2{  // the single line i am trying to make thinner
     stroke-width: 1px;
 }

---

Solution :

If you want to walk the entire selection tree, it would be:

.nvd3 g.nv-groups g path.nv-line {
  stroke-width: 9px;
}

.nvd3 g.nv-groups g.nv-series-2 path.nv-line {
  stroke-width: 1px;
}