Font-size increases exponentially on iPad

AnkiMobile (iPhone/iPad)
1

Hi,
could it be that using font-size: caIc(3em + 1vmin) is not a good idea for the app?
font-size: calc(3em + 1vmin);
I use em + 1vmin because I switch between a notebook and a high resolution tablet.
Otherwise the font would be too small on the tablet.

But then I wanted to use my ipad mini 2.
And then this happened after a few clicks:

IMG_49FFFA91D830-1
IMG_49FFFA91D830-11536Ă—2048 183 KB

It started out fine and then with every new card the font got exponentially bigger.
I assume the app remembers the font-size of the last card and re-calculates it.

2

In order to implement text scaling in recent iOS versions, AnkiMobile needs to rewrite font-size references in templates, and I’m guessing that’s interacting badly with calc(). You’ll probably have more luck using platform-specific CSS to specify a suitable font size on the iPad.

1 Like
3

Thank you.
I changed all calc() to an absolute like px.
The problem for the fonts are solved but other elements increase exponentially even though they don’t have em.

4

I think I found it after deleting almost the entire css on the ipad.

The code includes .win .card

AnkiMobile seems to ignore “.win” and claims the code for itself.

5

nope wasn’t .win. card.

but something else:
this code under .card caused the exponential growth:

transition: all .2s ease-in;