Responsive Text GIANT in cornerstone editor

[DzinePOD]

Hi,
I need help. The cornerstone editor is reflecting very large text for the mobile sizes. I’ve set up responsive text and added in another class to help with size, but I must be doing something wrong. Here’s a photo of what I have going on. Please help… feeling a bit lost.

I checked the forum and tried all kinds of tinkering… but ugh…
It looks good when previewing on my phone, but in cornerstone it’s not looking right at all and I want to make sure I don’t have a problem. It would be great to have it look right in the editor, too.

Thanks.

[ruenel]

Hello @DzinePOD,

Thanks for writing in!

Please remove this CSS code because this is forcing font size even on smaller screens.

.benQuote{
  font-size: 2.6em;
  letter-spacing: 0.05em;
  line-height: 1.5;
}

I can see that you are using the Responsive Text manager.

With this settings, the font size will vary from 18 to 36 pixels depending on the width of the text element.

If you want specific font size on a particular screen size, please remove the Responsive Text and use the responsive element styling by setting different font sizes on different screen sizes. In your Text element settings, Text > Text > Size, find the Font Size option and click on the “Size” text. You will see this option setting:

If you are not familiar with the Responsive Element Styling, please check this out first:

• https://theme.co/docs/responsive-styling
• https://www.youtube.com/watch?v=JCJkQazeRQU

Best Regards.

[DzinePOD]

Oh wow… great new addition for the toolbox. Thanks, this helped immensely. I see, though, when the text is h1 then the text is really huge. Where do I do to control the overall size of the header tags? I set the text now to p just to have it display nicely across all the different screen sizes, which is fine… but how would I do it if I needed it to be h1? Thanks so much for you help with us. Big help! So thrilled to learn this new tool. It’s really awesome.

[ruenel]

Hello @DzinePOD,

If you want to have h1 HTML tag, then use the Headline element instead.

Be advised that the Text element is highly recommend when you are trying to display a paragraph.

Hope this makes sense.