Archived topic
Changing Large Body Text Size For Mobile
5 replies · Started by Steve on December 19, 2021
Hi
Is there a quick way I can change the Large body text size sitewide across my site just for mobile? I've created a number of headings on each page on my site and used the large body text size for each, rather than as headings (which now I know is the sensible way to do things). At the moment the size for each is 36PX, which is fine on my desktop, but too large when I open each on my mobile. Is there any code I can paste in the "Additional CSS" field that would change it across the side?
This is an example of a page that is affected (any of the 'Buy From' headings).
Hi Steve,
You can try this CSS:
@media (max-width:768px){
.has-large-font-size {
font-size: 1.5em;
}
}Replace the value to your preference. :D
Thanks for your speedy reply Elvin. Not sure if I am doing something wrong, but I've pasted that text into the Additional CSS field and it doesn't seem to have made any difference. I've tried a number of values in the font-size field. What am I doing wrong?
Hi Steve,
The comments added to CSS need to follow this format/*your comment*/ to indicate they are comments, otherwise your CSS code will be effected.
https://www.screencast.com/t/mamWF3fzj9f
Eg, this comment: MOBILE TEXT SIZE need to be changed to/*MOBILE TEXT SIZE*/.
Let me know if this helps :)
Whoops rookie error! Thanks, all sorted now!
It happens :)
You are welcome!
