Archived topic
Styling Page Hero Headings
5 replies · Started by Pamela on January 10, 2021
I cannot figure out why my page heroes are not honouring the custom CSS I've applied in Customizer/Additional CSS for H1. H2 does have the text shadows and white colour that Additional CSS asks for.
In Custom CSS, I have this. Yet the H1 headings are yellow (which is the regular H1 colour and have no shadow>). Why isn't H1 honouring Additional CSS?
.page-hero h1 {
font-size: 90px;
font-weight: 600;
color: #FFFFFF;
text-shadow: 2px 2px #000000;
}
.page-hero h2 {
font-size: 40px;
font-weight: 600;
color: #FFFFFF;
text-shadow: 2px 2px #000000;
}
Hi,
Can you try removing all of the CSS on the Additional CSS and place only the .page-hero CSS to check if it works? So we could check if there are any syntax issues.
Let us know.
I've done that, and the H1s are still yellow.
Hi Pamela,
Your CSS should've worked.
Could you deactivate your cache plugin and clear all browser/ server cache to see if it works?
Let me know :)
I forgot all about LS Cache. Thank you. Emptying it didn't immediately fix the problem, but disabling it and other non-GP-related plugins finally has things looking the way I want them to.
Going forward I will go back to my trusty Aspire demo site, even if it means temporarily installing Elementor to access it, and not try to innovate with these other ones.
Glad you figured it out!
