CODEWITHSUNDEEP
csssassnavbar
Santiago
Santiago

Reputation: 3

Editing Bootstrap default styles

I want to modify the color and the border in a Bootstrap nav bar but when I write this on my SCSS nothing happens:

.nav-link.active {
    color: #495057;
    background-color: chartreuse;
    border-color: black;
}

When I inspect the element in Chrome my code is dismissed, It only takes into account the Bootstrap default style.

Image

Any help will be welcomed.

Thanks.

Upvotes: 0

Views: 41

Answers (1)

Thomas Pericoi
Thomas Pericoi

Reputation: 59

For a CSS rule to be overriden, you have a lot of options. The cleanest would be to be more specific (by at least one rule) than the one you want to override.

If I follow your example:

.nav-tabs li.nav-link.active {
    color: #495057;
    background-color: chartreuse;
    border-color: black;
}

You'll find more informations here : https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity

Upvotes: 1

Related Questions