I have a set of tabs with 2 buttons used to open the tabs. I have been able to style the normal and hover states for the tabs, however I have been unsuccessful with styling the active state.
Since this uses an external library for tabs, the button is marked active through a classname so I have to use the .active
class rather than :active
selector.
The element in question is as follows:
<a class="nav-link skills-tab active" id="design-tab" data-toggle="tab" href="#design" role="tab" aria-controls="design" aria-selected="true">Design</a>
I have tried styling through a combination of various class and id combinations such as:
#design-tab .active
.nav-link .skills-tab .active
#design-tab .nav-link .active
Unfortunately none of these seem to be working. I think there is other style on the website preveting this one from going through, thus I am trying to find the right style to overwrite it. Even !important
is not working.
The link to the webpage is here if you want to take a look at the work in progress to get a better idea: http://eg-graphics.com/Website%20New/about-us.html