Typography Not Changing Text Size When Working On Mobile Versions
Chad Criswell
Font size for a heading element is set to 2rem on desktop, tablet, and tablet portrait. Looks fine. When I try to make changes in mobile modes though changing the size variable does nothing. If I change the size variable I see no change on the screen. Height and italics, etc. seem to work but size will not change. See video in hidden content to see what I mean.
Atick Eashrak Shuvo
Accepted AnswerApologies for the inconvenience caused.
The reason the font size is not updating is due to your template’s custom.scss file, which is overriding all other CSS rules. The font size has been set using !important, preventing changes from taking effect elsewhere.
Please refer to the attached screenshot for clarification.
Atick Eashrak Shuvo
Accepted AnswerApologies for the inconvenience, and thank you for bringing this to our attention.
I’ve checked your website and noticed that the page contains different heading elements for different device sizes. The one you're trying to edit for mobile view is actually hidden due to responsive display settings, which is why your font size changes are not reflecting on the frontend.
To resolve this, I recommend using the backend editor tinyurl.com/22oyjjak. From there, please ensure you select the correct heading element that is visible on mobile, and then adjust the typography settings as needed.
Let me know if you need help identifying the correct element or making these changes. I'm here to assist!
Chad Criswell
Accepted AnswerI'm still unable to fix this. Please see this video. As you will see I did as you suggested (I think) regarding the elements but they still do not change the font sizes.