Elementor Font Size

Hi There,

Go to Content > Text Editor > Text tab when you are editing the text size. Make sure that the text is not having a style with size over there. Try removing any spam tag or P tag with size mentioned.

Once done, then try to change the size under Style > Typography. It should work then.

Let me know how it goes.

Regards

Thanks for your help. I did what you said and it sort of worked. I deleted all of the tags, then I could adjust the font size. However, it immediately added a “p” back in the bottom of the text editor window. Then I couldn’t change the size anymore. I then tried adding a “</p> at the beginning, which also worked, but then was immediately removed when I went away from editing the text. Apparently, Elementor keeps adding the style “P” tag or “Span” tag as soon as I click away from it. Not sure how to turn this off now!

Hi There,

Can you provide me your site’s page URL to check further?

Also keep the font settings done in the Elementor. So that we can see if it is getting applied or not.

Thanks.

Unfortunately the site is local on my computer and not published yet.

I have just done a test by switching themes and saw that with the 2016 theme from wordpress the issue goes away, I can edit text size with elementor in the text widget. This makes me suspect that it is something in Hestia overriding the text widget in Elementor. Is there some CSS to disable this in Hestia or some other workaround? Thanks for all of your help!

Hi There,

Without having the link to the website, it would be difficult for us to see what is happening exactly.

It should not be happening that way. Anyways I found another workaround if that can help.

1. Go to Advanced Tab > Element Style > CSS Classes. Write a class name without dot there. Example: my-class
2. Now go to WP-admin > Customize > Additional CSS. Paste the following code keeping the mentioned class:
   .my-class{ font-size: 10px !important; }
3. Click on Publish.
4. Go to your page front-end.

Hope this helps.

Thanks

Hello,

I am having the same problem. These are the tests I have done and my conclusions:

• Deactivating all plugins but Elementor did not have any effect. It is anot a plugin incompatibility matter
• Deactivating hestia and activating any other template: the font-size was properly applied in the text widget. So, it is a problem with Hestia.
• Removing the <p> tag makes that the text size is properly applied. It looks like if there was a configuration for <p> tags in the css of the theme that is causing the problem.

My website is already online at here. You can see that in the home page there is a blue box with text size set to 3rem, but it is not applied.

The workaround you suggested works but it is a quite consuming-time solution… I think that if that is the only solution I will have to change to another theme, but it means redoing a lot of work ??

I hope this helps to find out the problem.

Thank you very much for your help!

I contacted themeisle and they said that they were going to fix the issue in the next update. They did not identify what the cause of it was. Hopefully the update won’t be too long from now!

I think I have the same problem; after updating to 1.1.58 the font-size of certain texts is way too small. It’s not in the code of the text-section (manually), nor in Custom CSS.
When I go to Customizer > Appearance > Typography everything looks fine. Changing font size there doesn’t not effect the text in the front end.

I hope there is an update soon, because my client is not happy at all and I have no way of fixing this.

I was given the following CSS code and instructions from the Hestia team, they worked for me, hopefully they will do the same for you!:

Add this code in Appearance > Customize > Additional CSS and let me know if it works:

.elementor-text-editor p, .elementor-text-editor h1, .elementor-text-editor h2, .elementor-text-editor h3, .elementor-text-editor h4, .elementor-text-editor h5, .elementor-text-editor h6 {
font-size: inherit;
}

Thanks ibbw!

The site with my problem doesn’t have the plugin Elementor. I reacted on this topic because I’m guessing the underlying problem is the same.
I got this code as workaround:

.hestia-features .hestia-info p {font-size: 16px !important; }
.woocommerce .product .card-product .card-description p, .card-description, section.pricing p.text-gray, .woocommerce.single-product .woocommerce-product-details__short-description { font-size: 14px !important; }
h6.category { font-size: 12px !important; }

(You can change the font-sizes as per your requirement).

Like you I put it here so others can benefit.

I experienced a similar problem. The size slider bar actually changed the line height instead of adjusting the font size. In my case this happened with text that had been pasted into the text editor from another source. Text that had been entered from the keyboard was no problem.

Solution; when copying a block of text from anywhere, I now past in into a basic text editor, recopy and then past into Elementor = perfect !!

I hope my experience is beneficial to others.

I love Elementor ??

• This reply was modified 6 years, 8 months ago by thegnmsolution.