How to change font size on mobile only - Squarespace 7.1
Add this code to Custom CSS.
Adjust the “2rem” to a number that is either a whole number or has 1 decimal place.
Mobile size
/*Reducing font size for screens smaller than 640px*/ @media screen and (max-width: 640px) { h1 { font-size: 2rem; } h2 { font-size: 1.8rem; } h3 { font-size: 1.6rem; } h4 { font-size: 1.4rem; } }
Tablet size
/*Reducing font size for screens smaller than 960px*/ @media screen and (max-width: 960px) { h1 { font-size: 2.2rem; } h2 { font-size: 2rem; } h3 { font-size: 1.8rem; } h4 { font-size: 1.6rem; } }