Heading styles help

[johnjf]

Can I have heading styles set for my site example:
h1 { font-size: 30px; }
h2 { font-size: 28px; }
h3 { font-size: 25px; }
h4 { font-size: 20px; }
h5 { font-size: 18px; }
h6 { font-size: 16px; }

And then in my content I’d have

#post h1 {
font-size: 35px;
color: red;
}

Would this work? because I tried it and my main styles at top keep taking over my other styles such as #post h1.

Not sure what the problem is or if there’s another solution?

[Alen]

Use class .post not id #post. I would imagine there is a possibility of more than one post on the page. So using multiple id’s would be invalid syntax.

Here’s quick demo: http://codepen.io/anon/pen/mHgaK

[sloveland]

That should work, it sounds like you may be having specificity issues.

I made a quick demo, if you’re still having problems feel free to fork it or make your own in order to replicate the problem, that way we can look at it and help more.

http://codepen.io/sloveland/pen/ymint

[johnjf]

Thanks for the help guys. I went through it again and tried a couple of the changes and seen the changes were working so all I had to do was also edit my padding and margin styles.

[sloveland]

Cool beans!

[Author]

Posts