PrismJS / PrismJS/prism

highlighted line doesn't follow scroll when line number is enabled.

Open
#1,666 5 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug plugins
Dominant language
JavaScript
Stars
13k
Forks
1.4k
Avg merge
15h 36m
Merged PRs (30d)
3

Description

I installed current version of Prism last week.

Sample post is below :
http://red-souls.jp/ichounoki/rnote/software/20181216_042333932863.htm

I wrote the pre tag for upper source code box in the post as below :
<pre class="line-numbers" data-line="17" style="max-height: calc(16px0.81.5*31);">

As you can confirm, the highlighted line(line 17) doesn't follow when you move the vertical scroll bar.

But without line numbers, the highlighted line(line 17) follows correctly when you move the vertical scroll bar(you can see at lower source code box).

I think this is an bug of current version but so far I can't fix it. Is there anyone who can fix it?

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the issue with the linked sample page and the shown

 markup, comparing behavior with and without line numbers. Trace the line-highlight and scrolling behavior in the Prism source; done means the highlighted line remains aligned while the code block is vertically scrolled in both cases.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.