Xaringan: Mathjax fonts resizes when reloading current slide

[ekstroem]

I've been tampering with my css file and noticed that the math font size changes for the current slide if the slide is reloaded. I can reproduce this with the default css file as well and 'm trying to wrap my head around why it happens.

I actually get the same result when looking at the official xaringan documentation: Look at this page which contains math. If I open that in chrome the mathjax font has one size but if I reload the page then it becomes slightly bigger (and imo better). If you go one slide right, reload that page, and goes back then the font changes back.

The page reload only affects the current slide - if I have math expressions on other slides their size is not changed unless I reload the individual slides (and then the math size reverts on the other slides).

Is that happening to other people or is it simply my chome setup that plays tricks on me?

Edit: also get the same result in safari and firefox. I thought it was the cache in chrome but doesn't look so.

[yihui]

I can see the issue in Chrome, too, but I have no idea why it happens, so I guess there is no way I could fix it.

[yihui]

Well, I can probably fix it using the slideshow.on('showSlide') event, i.e. do not automatically render all math expressions on a slide until it becomes visible. I don't have time for this, though.

[nmjakobsen]

The same thing happened to me - the math font size was actually quite tiny until I reloaded the slide. After trying out a whole bunch of different MathJax font-size-related solutions which didn't work, I was able to "fix" the problem by inserting .mjx-chtml{ font-size: 110% !important; } in my .css file (after reading Joseph Rex's reply here). This seems to work in all three of the web browsers mentioned above. It certainly doesn't seem to be the "recommended" way of solving MathJax font-size problems, though. :-)

[leovan]

.mjx-chtml{ font-size: 100% !important; } works fine for me, 110% is a little bit larger.

[yihui]

Should be fixed now. No more CSS hacks required.

[ekstroem]

That is nothing short of wonderful! Thanks.