CODEWITHSUNDEEP
htmlcsstwitter-bootstrap-3
thirdEye
thirdEye

Reputation: 47

Can we override the BOOTSTRAP using media queries from CSS File?

1) I used a Bootstrap to build a page 2) I used the following media query in the CSS FILE to override the bootstrap. 

@media screen and (min-width: 500px){
body {color: #ccc;}
}

It doesn't change the body color after the break point. a) Can we override the Bootstrap using media query(from CSS File)? b) Any idea what could have gone wrong here ?

Upvotes: 0

Views: 631

Answers (3)

Pouya Ataei
Pouya Ataei

Reputation: 2169

Solution:

Just add !important after the color code, and you're good to go.

The Code:

Like this:

@media screen and (min-width: 500px){
  body {
        color: #ccc !important;
       }
}

Explanation:

The !important rule is a way to make your CSS cascade but also have the rules you feel are most crucial always be applied. A rule that has the !important property will always be applied no matter where that rule appears in the CSS document

Upvotes: 0

ExtremeCode
ExtremeCode

Reputation: 114

Create a custom css file. Write your css. link the css file to your html just under the bootstrap css file

Upvotes: 1

Amit Kumar Singh
Amit Kumar Singh

Reputation: 4475

Yes, you can override the bootstrap with your css. Just include css on the page after bootstrap.css file. Also, double check if your media query is doing what it is intended to do.

Upvotes: 1

Related Questions