Global CSS code for adjusting font size based on screen size

Hi there,

I am a Cornerstone user. I used the following code to adjust font size based on the screen size. It works for each web page that I added such code, but it takes time to add it to each web page. How to use such code as global code, so it works for all the web pages?

Thanks,
Chris

@media screen and (max-width: 720px){
h1 {
font-size: 44px !important;
}
h2 {
font-size: 32px !important;
}
h4 {
font-size: 24px !important;
}
}

Hi Chris,

For it to take effect on all pages, you need to add the code in Theme Options > CSS instead of Conrerstone > CSS

Thanks

Hi Paul,

How to get to the page in your screenshot? In my WordPress account, I tried to go to Appearance -> Themes -> Chick the “Customize” button from X theme, but I only saw the “Additional CSS” option. I couldn’t find the page in your screenshot.

Thanks,
Chris

I found it. It works on all pages now. Thanks.

It looks like it works for all the pages except the homepage (the English language homepage). When I checked on my mobile phone, I saw the font size was still the same on the homepage (English language homepage). The font size was reduced properly on other pages according to the screen size. Could you please check?

Thanks,
Chris

Some additional info for you.

I also tried on my PC. I saw the font size was reduced on the homepage (the English language homepage) when I dragged my mouse to reduce the screen size to simulate a mobile phone screen. It works properly. But on a real mobile phone, it didn’t work. Could you please let me know how to fix it?

Thanks,
Chris

Some updates. I tried to refresh my website and clean caches on my browser, but it didn’t work. But it works just now. I didn’t do anything and don’t know what happened. Anyway, it looks like the issue is fixed :slight_smile:

Hi Chris,

It seems to be a temporary caching issue on your end and glad it works for you now :slight_smile:

Cheers!

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