Font size in Chrome Mobile

Russinating · 30 Jun 2014 at 13:21

Everyone on these forums knows about the issue with font sizing in Chrome Mobile - different posts being different sizes randomly etc - but I'm getting the same issue across all our sites, but less random and specifically with the copyright footer (which should have a smaller font size and does on desktop).

The code across all the sites is pretty similar and very simple:

Code:

#copyrightinner p {
text-align:center;
font-size:80%;
}

But what I see is:

For reference the sites are idoweddingfilms.co.uk, jonesmillbank.com and hoverfox.com/new so you can see how they look on desktop.

Any ideas? :confused:

simisker · 30 Jun 2014 at 15:41

I noticed that the base font size [declared for body element] of all three sites is percentage-based, and this is apparently a Webkit bug:

http://codepen.io/tysonmatanich/pen/wetLC

So I imagine you only need to convert that to an equivalent fixed size for each site.

Russinating · 30 Jun 2014 at 18:59

Hmm interesting, I thought it was good practice to use %. What's next best, pt or px?

Tripnologist · 30 Jun 2014 at 20:43

Russinating said:
Hmm interesting, I thought it was good practice to use %. What's next best, pt or px?

That depends on what you're supporting.
I quite like rem, myself.