Setting font sizes for Mobile

katjachipolo · August 2016

Hi,

I want to customize font sizes for Mobile devices.

When I turn on the Decrease Fonts options the headings are the same size as the text which doesn't look that good.

If I turn this option off, the fonts are too big for mobile.

Is there a third options where I could set the font sizes for mobile for all headings + paragraphs?

Thanks for help.

Best,

Katja

Albert · August 2016

Hi,

the third option is custom css.

uglyduky · August 2016

What CSS can we use for that?

Albert · August 2016

@uglyduky It depends on what you want to do exactly. But if you want to control different sizes on mobile devices, you need to use right @media tags. More details about the media you can find on http://www.w3schools.com/cssref/css3_pr_mediaquery.asp but also you can check responsive.css file where all media declarations are.

katjachipolo · August 2016

I tried this, but it doesn't work. Any ideas?

@media only screen and (max-width: 1240px)

h2 {

font-size: 20px;

}

Albert · August 2016

@katjachipolo It does not work because you forgot about brackets before the css and after it. Please check the link we left above where it was explained how to use @media properly or just check responsive.css file because your code doesn't look good.

Setting font sizes for Mobile

Comments