How to increase font size on mobile with Cornerstone

Hello. How do I increase the font size of specific text on a page built with Cornerstone on mobile and iPad only? The text size is fine on desktop but it is too small on mobile/iPad.

Here’s the link: https://barbellrehab.com/phoenix/

The text I’m referring to is right next to the big AFAA logo near the top of the page. It says “15.0 contact hours available for AZ/CA Physical Therapists and PT Assistants”

If you view on mobile, you will see what I mean about how it is too small.

For your reference, this is normal “text” on a normal “row” (not the classic elements)

Please advise. Thanks!

Hi Michael,

Thank you for reaching out to us. To change the font-size of your text in small devices, simply add the following code in the Element CSS section of your Text element:

@media screen and (max-width: 480px) {
  $el {
  	font-size: 2em !important;
	}
}

Please note that the code provided above serves as a guide only and is to help you in getting started so implementing it and maintaining the code will be out of our support scope and for further maintenance for new possible versions of the theme that may cause the customization to break, you will need to hire a developer.

Hope this helps!

This was exactly what I was looking for. It worked. Thanks!

You’re very welcome, Michael!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.