By using Elementorforum.com’s services you agree to our Cookies Use and Data Transfer outside the EU.
We and our partners operate globally and use cookies, including for analytics, personalisation, ads and Newsletters.

  • Join the Best Unofficial Elementor Support forum

    Provide or get advice on everything Elementor and Wordpress, ask questions, gain confirmation or just become apart of a friendly, like minded community who love Wordpress and Elementor


    Join us!
elementor official

Question H1 HEADER FONT SIZE CHANGE DOESN'T UPDATE WHEN VIEWED ON OTHER BROWSERS

shadow

New Member
Likes
0
#1
Hello,

I have embedded an H1 header in a certain page in my website so that google could detect the existance of a H1 header in that page.
I wanted to reduce the H1 header's size and hence went to the font settings and picked a smaller font size.
When applying the change I was able to see the H1 header in it's smaller size only when I was logged to WP but not when logged out of it or when viewed the page with a different web browser.

** When I tried to change the header from H1 to H4 the size reduced and I was able to see the header in a smaller size on all browsers even when was disconnected from WP**
For SEO purposes I would like to have an H1 header, but on a smaller size.
Could anyone please advise how to solve this issue?
 
elementor official

markdaps

New Member
Likes
0
#2
It could be that a pixel / em size has been set and in that instance, changing the header tag using the xs, sm etc doesn't take effect.
 
elementor official

shadow

New Member
Likes
0
#3
I thank you for your reply.

I didn't understand what you meant by saying that a pixel/em size might have been set. can you elaborate on that please?

I was able to change the size while keeping the header as H1 by:
1. Setting the HTML TAG to H1
2. Setting the size option (Appears just about the HTML Tag) to medium or small
*without changing the font size.
 
elementor official

markdaps

New Member
Likes
0
#4
Hi,

If you have the style size setting with anything other than empty / value / null in the screenshot attached, then choosing a size under the 'Content' tab won't change the font size.

I see it as two ways to set the font size for the header tag, and only one of those of course can be applied to the header tag with css at any one time.

Screenshot_2019-05-18 Elementor Home.png
 
elementor official

shadow

New Member
Likes
0
#5
Thanks for the reply Mark,

Just to add some insight on this regard, it seems to be that the font size (under style tab) is set to 20 (as I tried to change the header size via the font size first),but that change didn't take effect as I mentioned.
even though set to the size of 20 without any size changes taken in affect, I was manage to change the size via the Style option under the Content tab.
It is as if the Size under the style tab, doesn't do anything, but rather only the Size under the content tab.
 
elementor official

markdaps

New Member
Likes
0
#6
Hmm,

Seems we have different css priority orders (using EM Pro, Kava Pro and Jet/Block at my end).

If using Pro, you could add css to override (or add ID / Class and css to customizer or child theme style sheet.

/* one or the other */
selector h1 {
font-size: x-large;
}


/* relative to root */
selector h1 {
font-size: 3em !important;
}
 
elementor official
elementor official