Skip to content

\enclose notation is not sized or positioned to its content #3107

Description

@Zahara-Nour

Description

The notation of \enclose (box, rounded box, circle, strikes) is not sized or positioned to its content. This was reported in #864 and #1697, which are closed, but the problem is still there in 0.111.1 for any content that contains an operator or a fraction.

Steps to Reproduce

Render these formulas, for example with convertLatexToMarkup() or in a <math-span>:

  1. a\enclose{roundedbox}[1px solid red]{x+1}b
  2. a\enclose{box}[1px solid red]{3+5=8}b
  3. a\enclose{box}[1px solid red]{\frac{1}{2}}b
  4. \enclose{roundedbox}[3px solid green, padding="6"]{1234} (from Border with \enclose latex command is misplaced while using padding #1697)
  5. \enclose{horizontalstrike}[1px solid red]{x+1}

Actual Behavior

  • 1 and 2: the box is too narrow. The last character overlaps the border, and the following text (b).
  • 3: the box is too wide, and the fraction sits on its left side.
  • 3 and 4: the padding is all below the content. Fractions touch the top of the box.
  • 5: the horizontal strike is drawn below the baseline, as an underline.

Left: 0.111.1. Right: with the fix from the pull request.

Image

Measured in Chrome, font size 40px, \enclose{roundedbox}:

Formula Width of the box Width of the content
x+1 2.47em 2.31em
3+5=8 3.68em 4.08em
\frac{1}{2} 2.66em 0.55em
\frac{3x+1}{x^2-4} 6.21em 2.86em

Expected Behavior

The notation encloses its content with the same padding on every side, and the horizontal strike crosses the characters.

Cause

In src/atoms/enclose.ts:

  • The base is given an explicit width, base.width, and the notation is sized with it. This computed width does not include the spacing around binary and relational operators, which is applied later (see the comment of softWidth in src/core/box.ts). For 3+5=8, the missing spacing is 2 × 0.22em + 2 × 0.28em = 1em, the difference measured above. It also overestimates vertical lists such as fractions.
  • The notation has top: 0 and a height of height + depth + 2 × padding, so all the padding is below the base.
  • The line height of a formula (1.2) makes the line box of a line of text taller than its computed height, so the SVG overlay (strikes, arrows), which is drawn with the computed metrics, is misplaced.

I have a fix with tests and will open a pull request.

Environment

MathLive version 0.111.1

Is this a regression: did it use to work in a previous version?

No, see #864 (2021) and #1697 (2022).

Operating System macOS

Browser Chrome and Safari (same behavior)

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions