I’m trying to use Katex to render mathematical formulas on my website. It works perfectly fine on desktop browsers, but when I open the same page on mobile using Quick Edit, I get an error message: "Katex doesn't work in quirks mode. Make sure your website has a suitable doctype." I’ve already added the declaration, but the error still persists. The page renders correctly in Edge in Mobile.
Here’s a simple test page:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Katex Test</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.15.3/dist/katex.min.css" />
<script src="https://cdn.jsdelivr.net/npm/katex@0.15.3/dist/katex.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/katex@0.15.3/dist/contrib/auto-render.min.js"></script>
</head>
<body>
<h1>Katex Test</h1>
<p>\(E = mc^2\)</p>
<script>
document.addEventListener("DOMContentLoaded", function() {
renderMathInElement(document.body, {
delimiters: [
{ left: '\\(', right: '\\)', display: false },
{ left: '\\[', right: '\\]', display: true }
]
});
});
</script>
</body>
</html>
What could be causing this error in QuickEdit? Or any other Android HTML IDEs that support Katex rendering? Any advice or suggestions would be much appreciated.
Source: View source