MathJax 库在公式中留下滚动条答案

【问题标题】：MathJax Library Leaving Scroll Bars in FormulaeMathJax 库在公式中留下滚动条
【发布时间】：2018-06-05 04:46:17
【问题描述】：

我一直在尝试使用 MathJax 创建一些数学工具用于我的 A-Levels，我目前正在制作一个用于二次方程的页面和一个用于二次方程根的小型计算器。

当我尝试使用 MathJax 显示公式时出现问题，正如您在此处看到的 (http://www.lucapassariello.co.uk/mathsTools/quadratics)，显示的是一堆滚动图标，并且当正确的公式确实显示很短的时间时，一切似乎都被提升为虚无的力量。

以下是用于库的链接和配置脚本。

    <script type="text/x-mathjax-config">
      MathJax.Hub.Config({
        tex2jax: {inlineMath: [["$","$"],["\\(","\\)"]]}
      });
    </script>
    <script type="text/javascript" async src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.4/MathJax.js?config=TeX-MML-AM_CHTML"></script>

这里是二次公式的实现 HTML。

<p>$$x=\frac{-b \pm \sqrt{b^2 -4ac}}{2a}$$</p>

非常感谢任何帮助。

【问题讨论】：

标签： javascript html math mathjax

【解决方案1】：

您提供的代码按预期工作，所以我认为它必须与您的网站有关。

如果您从resources/public/css/style.css 文件中的以下代码中删除 overflow-x: hidden;，那么您将恢复工作。它似乎与 Mathjax css 冲突并切断了从脚本呈现的元素。

如果您仍然需要overflow-x: hidden，那么我建议您对它更有选择性，而不是使用*

*{
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}

【讨论】：