targeted CSS of H1 on a single page
Hi, for some reason the following CSS is not working on mobile devices. Can you help?
The CSS is put in child theme. The target page is homepage only. CSS ID is entered correctly. Every page needs H1, so I don't want to change it to custom <p> text and use builder functions.
Page link: https://syriana.ca/
/* Homepage - h1 custom styling */
#home-hero h1 span {
font-size: 55px !important;
}
@media (max-width: 991px) and (min-width: 768px) {
#home-hero h1 span {
font-size: 40px !important;
}}
@media (max-width: 767px) {
#home-hero h1 span {
font-size: 30px !important;
}}
0
-
Hi,
Thank you for reaching out.
We’ve checked the page on our end using developer tools, and it appears that the styling is working as expected. Everything looks correct from our side.

Best regards,
Ariel H.0 -
Hi Ariel,
I was not seeing it updated in the mobile browser, but once I cleared the cache I saw the update. Thanks!
0
Please sign in to leave a comment.
Comments
2 comments