Numbered, centered, long equations are incorrectly indented
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 10.9k
- Forks
- 1.2k
- PR merge metrics
- No merged PRs in 30d
Description
Issue Summary
Numbered, centered, long equations are indented even though they shouldn't be. This means that long equations are flowing into the margin much sooner than they should be. Here is a screenshot:
Steps to Reproduce:
Please open the attached HTML file (see at the bottom).
The issue does not occur when equations are {unnumbered and centered} or {numbered and left-aligned} (via displayAlign: 'left'). The issue occurs both with SVG and CHTML.
Technical details:
- MathJax Version: 3.2.2 (according to
MathJax.versionin browser console) - Tested with the following browsers:
- Firefox 105.0.3 (64-bit)
- Chromium 106.0.5249.119 (Official Build) Arch Linux (64-bit)
- Microsoft Edge Version 106.0.1370.47 (Official build) (64-bit)
I am using the following MathJax configuration:
MathJax = {
tex: {
tags: 'all'
}
}
and loading MathJax via
<script
type="text/javascript"
id="MathJax-script"
async
src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-svg.js">
</script>
Feature request
In addition to fixing this bug, it would be great if MathJax were able to put the equation number below the equation for long equations, like LaTeX does:
I can open a feature request for this separately should this be desired.
HTML file
<!DOCTYPE html>
<html>
<head>
<style>
body {
width: 650px;
margin: auto;
text-align: justify;
}
</style>
<script>
MathJax = {
tex: {
tags: 'all'
}
}
</script>
<script
type="text/javascript"
id="MathJax-script"
async
src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-svg.js">
</script>
</head>
<body>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
\[
\left(1+x\right)^n
= 1 + nx + \frac{n\left(n-1\right)}{2!}x^2
+ \frac{n\left(n-1\right)\left(n-2\right)}{3!}x^3
+ \frac{n\left(n-1\right)\left(n-2\right)\left(n-3\right)}{4!}x^4
+ \ldots
\]
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
</body>
</html>
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Reproduce the issue with the HTML example in the report, using the shown MathJax configuration and the tex-svg.js loader; compare SVG and CHTML output for numbered, centered, long equations. Trace the displayAlign and equation-number layout behavior, and consider the existing unnumbered-centered and numbered-left-aligned cases as controls. Done means long numbered centered equations no longer indent prematurely in either output format.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100