Changing mathjax's font size

Question

I am using mathjax on my page, and i have read that this:

Answer 1

When you have some math inside a div:

<div id="some_math"> $$ x^2 $$</div>

you can change the font size simply by using CSS like this:

$("#some_math").css("font-size","150%");

Answer 2

Here are two options to change font size for a specific equation or portion of an equation.

1. Use a .css class.

   \class{className}{}

The className is div class name that can be specified in css.

2. Use Latex

\tiny{ }, \scriptsize{ }, \small{ }, \normal{ }, \large{ }, \Large{ }, \LARGE{ }, \huge{ }, \Huge{ }

If you want to change all equations globally MathJax prints inside of a div. Use css to edit the class font size.

.MathJax {
    font-size: 12pt;
}

Finally if you could also edit the MathJax config to change fonts globally, but I prefer the css version because it allows you change font sizes for different screen sizes.

Answer 3

Do not use css as the others are suggesting, especially if in combination with linebreaking. Mathjax calculates how much space it requires for linebreaking, so if you change its size afterwards, you can get chaotic results(overfloww, bad breaking, clipping etc)

Do it throught config or MML/Tex

Styling MathJax

Answer 4

MathJax 3.0.0:

<script>
    MathJax = {
        tex: {
            inlineMath: [['$', '$'], ['\\(', '\\)']]
        },
        chtml: {
            scale: 1.3
        },
        svg: {
            scale: 1.3
        }
    };
</script>
<script src="/js/mathjax/tex-chtml.js" id="MathJax-script" async></script>