ASP MVC cannot override bootstrap css [duplicate] - html

Question

This question already has an answer here:
Overriding bootstrap table-striped rows with jquery onclick function
(1 answer)
Closed 5 years ago.
I have tried so much to override bootstrap css with the following navbar css. Every time I try to load the css, I can't even see anything in my browser
.navbar-default {
background-color: #205ba2;
border-color: #2d74ca;
}
.navbar-default .navbar-brand {
color: #ecf0f1;
}
.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus {
color: #dce9f8;
}
.navbar-default .navbar-text {
color: #ecf0f1;
}
.navbar-default .navbar-nav > li > a {
color: #ecf0f1;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
color: #dce9f8;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
color: #dce9f8;
background-color: #2d74ca;
}
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
color: #dce9f8;
background-color: #2d74ca;
}
.navbar-default .navbar-toggle {
border-color: #2d74ca;
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
background-color: #2d74ca;
}
.navbar-default .navbar-toggle .icon-bar {
background-color: #ecf0f1;
}
.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
border-color: #ecf0f1;
}
.navbar-default .navbar-link {
color: #ecf0f1;
}
.navbar-default .navbar-link:hover {
color: #dce9f8;
}
#media (max-width: 767px) {
.navbar-default .navbar-nav .open .dropdown-menu > li > a {
color: #ecf0f1;
}
.navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
.navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
color: #dce9f8;
}
.navbar-default .navbar-nav .open .dropdown-menu > .active > a,
.navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
.navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
color: #dce9f8;
background-color: #2d74ca;
}
}
This is the correct order in my opinion but it doesnt work at any time.

Answer 1

You need to include your CSS link to the page after link to
Bootstrap. For example:
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="mytheme.css">
For some rules you need to use !important.
Also try to add any query string to your CSS-file URL to avoid
сaching problem, for example:
<link rel="stylesheet" href="mytheme.css?version=new">