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 trial

CSS

CSS Style Overrides

Hi there, building my website currently and just trying to get the CSS styles worked out. I'm encountering a problem I never have before, I'm totally confused! My CSS styles keep overriding each other within the same style sheets and just generally acting weird. For example for the "#content" area div, I'll put

#content h1 {
color: yellow;
}

#content p {
color: red;
}

And whichever is later in the style sheet will work and the first one won't. My most current styles exist online at hannahswann.com/test. Please halp!!

6 Answers

So what you are saying is your #content h1 does not have the yellow style applied but the #content p will work properly?

Yeah, that is the problem. It's not the actual code however. Alot of my css is not styling properly and just being sort of weird. Not sure if its just tiny mistakes on my part or some sort of big thing I overlooked.

Hi Hannah, Try moving #content above #content h1 and #content p in your style.css stylesheet so the home page section would look like

#content {
    background-color: #F2ECE7;
}


#content h1 {
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    color: #F2736A;
    text-align: center;
    }

#content img{
    display:block;
    margin:auto;
    width: 100%;
}

Hope that helps! And that's a really nice looking design by the way.

Thanks! I actually ended up getting it working. You can check out the updated version on the same URL. CSS can either be so awesome or so finicky... you never know. I still have to put together the other pages and then make it into a theme for wordpress. Hopefully it doesn't take me too long! I may be back on here with any more problems.

Thanks! I actually ended up getting it working. You can check out the updated version on the same URL. CSS can either be so awesome or so finicky... you never know. I still have to put together the other pages and then make it into a theme for wordpress. Hopefully it doesn't take me too long! I may be back on here with any more problems.

Lol, glad to hear its working and good luck with whatever you decide to do with the site :)