0

Hello for some reason my custom CSS is being overwritten, I have correctly placed my custom CSS below the CDN bootstrap reference but that does not seem to solve the issue. For example if I am trying to change the font color for a header with an h1 inside. When using classes or id's the font color will not change. Though if I target the header by writing whats below in my CSS file it does work

header h1 {
  color: white;
}

I do have an some understanding about specificy but I would assume declaring it with a class or id should be specific enough and go over the _reboot.scss file but it does not seem to. I am using BootStrap 5.

JShabs
  • 11
  • 2

1 Answers1

0

In your example cdn or node_modules css always on top. After that put your custom css files.

Order of prioritization when using multiple contradictory css files

batgerel.e
  • 837
  • 1
  • 10
  • 31
  • Hello as I stated I linked my custom CSS last. It looks like the reboot file calls the body making the color: gray. Now I make a class for the header and write .headerclass{color:white} and it does not change the color, though when adding another specifier h1 then it does apply. See I dont understand why, because the class should be more specific then just a body specifier in reboot. Also when I simply write body{color:white} it does change the color. I am misunderstanding something? – JShabs Jun 18 '21 at 18:07