Text Formatting Options Not Working

[egraham1225]

Hi,

I tried using both the new text element and the classic text element to create a headline. I was playing around with the text formatting options (font size, letter spacing, line height, weight). They aren’t changing the text. I have a responsive class, but I tested taking it out just in case that was stopping it.

Thanks.

[christopher]

[Hi there,

Please kindly make sure that you are using version 5.2.2 of the theme and version 2.1.3 of the Cornerstone plugin. If not please update them](https://theme.co/apex/forum/t/setup-updating-your-themes-and-plugins/62).

Then please clear the cache if you have such plugins and deactivate all your 3rd party plugins except the Cornerstone.

Then add a new page and try to add the new text element and see if the changes work.

If not kindly get back to us with the URL/User/Pass of your website using the Secure Note functionality of the theme to follow up.

Thank you.

[egraham1225]

Thanks for the response. I have the latest versions. I went through and deactivated the plugins, but that doesn’t seem to be causing an issue.

I figured out what’s happening. It’s a CSS issue. The text I am using is an H1, but if I change it to a p tag all the formatting options work.

Renew’s default h1 letter spacing and line height is blocking what I choose in the text format panel. I know how to make it take precedent by adding CSS, but I want to make sure I can do it via the panel in the future.

If you still need to take a look I have added a secure note.

[christopher]

Hi there,

That is actually correct. If you add an h1 tag inside the text element you will not be able to change the line height and letter spacing and something like those options.

The reason is that all those options are applied to the wrapping div tag of the text the text element. But you used an h1 so the final code is:

<div class="el131 x-text">
  <h1>hello</h1>
</div>

The changes are applied to x-text element, but the h1 tag has its own CSS from the theme itself. As the CSS of the theme is directly pointing to h1 it will have priority over the wrapper styling.

For such cases, you will need to use the headline element which will do the trick for you.

Thank you.