KaTeX / KaTeX/KaTeX

\tag is expected to be always flushed at right when equation is overflowed

Open
#1,983 10 comments 0 reactions 0 assignees View on GitHub
bug
Dominant language
TypeScript
Stars
20.4k
Forks
1.3k
Avg merge
14h 37m
Merged PRs (30d)
7

Description

> Before reporting a bug
- [x] Check [common issues](https://katex.org/docs/issues.html).
- [x] Check the bug is reproducible in [the demo](https://katex.org). If not, check KaTeX is up-to-date and installed correctly.
- [x] Search for [existing issues](https://github.com/KaTeX/KaTeX/issues).

**Describe the pool rendering:**
For a long equation set to `overflow-x: auto`, the right-end `\tag{}` will overlap and scroll with the equation.
You can use Eqs. 7.85 and 7.86 as a test case (with a narrow window), available [here](https://spaceresearch.top/blog/97ae8555/#7-2-relevance-vector-machines).
```css
// allow katex equations scrolling horizontally, without vertical scrollbar
.katex-display > .katex {
height: auto;
overflow: hidden;
overflow-x: auto;
}
```

**Expected behavior:**
The `\tag` will be flush right no matter the equation is scrollable or not.
I'm not familiar with CSS. I tried to play around
```css
.katex-display>.katex>.katex-html>.tag {
position: absolute;
right: 0;
}
```
A feature of `position` mixturing `absolute` and `static` should be perfect. `sticky` doesn't fit in current setting, it is a mixturing of `relative` and `fixed` as I understand.

Contributor guide

Open the contributing guide

Research direction

Reproduce the long-equation case in the KaTeX demo using Eqs. 7.85 and 7.86, a narrow window, and the provided overflow-x CSS. Inspect the rendered .katex-display > .katex > .katex-html > .tag behavior; done means the tag stays flush right whether the equation overflows or not.

Written by the indexing model from the issue text.

Assessment

Tech stack
css
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.