0

I have tried so many times to give less priority of Bootstrap CSS but I am not able to give it. I have placed my custom.css below the CDN link of Bootstrap

 <!-- Bootstrap CSS -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous"> 
    <!-- Bootstrap JS -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
    <link rel="stylesheet" href="style.css">
Writing !important to all the CSS Properties would be a very hard task since I am working on a very big project which has many line of CSS Codes
Afnan Ahmad
  • 166
  • 1
  • 1
  • 9
  • 1
    Your homework: https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity – Ruskin Mar 21 '22 at 07:11
  • We cannot help more unless you supply some of the problematic css from `style.css` – Ruskin Mar 21 '22 at 07:13

1 Answers1

-1

Why dont use !important instead on your custom.css?

The !important rule in CSS is used to add more importance to a property/value than normal.

In fact, if you use the !important rule, it will override ALL previous styling rules for that specific property on that element!

https://www.w3schools.com/css/css_important.asp

AdityaDees
  • 1,022
  • 18
  • 39
  • !important as a tool of last resort: https://stackoverflow.com/questions/8360190/is-it-bad-to-use-important-in-a-css-property – Ruskin Mar 21 '22 at 07:15
  • [!important is valid CSS syntax](https://stackoverflow.com/a/8360363/7590238) and there is nothing wrong with using it—provided you understand what it is doing and why it is solving your problem, so that you use it in the right way. – AdityaDees Mar 21 '22 at 08:43