Hi there,
I want to stylize my different headers (H1, H2, H3, H4). I created a test page showing each of these header types, used the SiteOrigin CSS Editor, hit save and nothing has happened.
The resulting css looks like this:
______
}
.entry-content > *:first-child {
text-transform: capitalize;
}
.entry-content h2 {
color: #0b5193;
}
.entry-content h3 {
color: A7A9AC;
}
.entry-content h4 {
color: 69BD45;
}
_____
I tried simplifying the code to omit .entry-content but nothing happened.
What am I missing here?
Quick update – I noticed several errors with the resulting code… this seems to have fixed the problem (although the system is now cautioning against the use of !important)…
h1 {
text-transform: uppercase;
}
h2 {
color: #0b5193 !important;
}
h3 {
color: #A7A9AC !important;
}
h4 {
color: #69BD45 !important;
}
Hi Jennifer
Thanks for your question.
Vantage CSS uses prefixes headings one through six with the entry-content selector, that means that if you don’t, your Custom CSS has lower specificty and is therefore overridden by the original rule. !important is one way around this, you could also increase specificity. If you send a URL to your site we’d be happy to take a look and assist with that.