How to make MathJax responsive and add line breaks automatically? <p>I've read the MathJax documentation for adding line breaks automatically but it seems to have no effect. </p> <p>I don't know how to make MathJax responsive. My website allows users to write in LaTeX especially for mathematical formulas. However, on mobile screen, sometimes the output is too wide and I need somehow to find a way to resize it.</p> <p>I can't ask my users to use this functionality only for short formulas.</p> <p><em>Exemple of incorrect output :</em> </p> <p><a href="https://i.stack.imgur.com/z2s4c.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/z2s4c.png" alt="enter image description here"></a></p> <p><em>What I did based on the documentation (but does not work) :</em></p> <pre><code>MathJax.Hub.Config({ tex2jax: { inlineMath: [['$','$'], ['\\(','\\)']] }, "HTML-CSS": { linebreaks: { automatic: true } }, SVG: { linebreaks: { automatic: true } } }); </code></pre> <p>Full code on JS Fiddle : <a href="https://jsfiddle.net/ao8cnquw/" rel="nofollow noreferrer">https://jsfiddle.net/ao8cnquw/</a></p>