Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trialjason limmm
8,009 Pointsproblems with background color
i think i put the correct code in but my website wouldn't turn it's background color orange
i put normalize css and bootstrap into this project if that happens to have something conflicting
body{
background-color:#ffc067;
}
1 Answer
Rohald van Merode
Treehouse StaffHi jason limmm 👋
It's hard to tell what is causing this to happen without seeing your code in it's entirety. I'd recommend to check the dev tools and inspect the element to see what styles are being applied to it. Most likely you have some conflicting styles elsewhere with a higher specificity causing it to overwrite this specific rule you're adding.
Hope this helps! 🙂
jason limmm
8,009 Pointsjason limmm
8,009 Pointsok, i checked the devtools and it says that the background color was overridden by something else but i don't quite know what is it being over ridden by. how can i check the thing that is over riding my background
Rohald van Merode
Treehouse StaffRohald van Merode
Treehouse StaffIn the
Styles
tab when inspecting the element. The selectors are ordered by specificity level, so if it's being overwritten there must be a rule above thebody
selector that is also setting background value.jason limmm
8,009 Pointsjason limmm
8,009 Pointsoh ok i see, it's another background-color property, but it's in a file called _reboot.css so i don't know how to change it.
Rohald van Merode
Treehouse StaffRohald van Merode
Treehouse StaffThat is a file that is being added by Bootstrap. You'll want to ensure that your custom stylesheet is linked after the Bootstrap stylesheet in your HTML file. This allows your styles to override the Bootstrap styles due to the CSS cascade
If that doesn't work try to use more specific selectors to increase the specificity of your styles to override the Bootstrap styles. For example, instead of targeting
body
, usebody#body
Hope this helps!