-
Notifications
You must be signed in to change notification settings - Fork 12k
Description
Have you checked that your issue isn't already filed?
- I read through FAQ and searched through the past issues, none of which addressed my issue.
- Yes, I have checked that this issue isn't already filed.
Bug description
When using diff2html to generate diff blocks in posts, there's a visual issue where the last row line number overflows at the end of files. This creates a confusing display where the final line number extends beyond its intended container within the diff view.
How to reproduce the bug
This issue can be observed in practice at: https://alshedivat.github.io/al-folio/blog/2024/code-diff/#d2h-575068
In this live example, you can see an extra line number "183" appearing as an overflow element for scripts/hulk.js
diff block, demonstrating the exact visual problem where line numbers duplicate or appear in unintended positions within the diff display. Multiple other examples of this overflow issue can be found throughout the same page in various diff blocks.
Error messages and logs
Please see attached image above.
What operating system are you using?
Not applicable (e.g. you're using GitHub Pages or other hosting)
Where are you seeing the problem on?
Deployed site
More info
Related Issue
I searched for similar issues and found this appears to be related to the known issue in rtfpessoa/diff2html#381, but the specific manifestation may vary depending on the diff content and css setup.
That issue suggests some CSS workarounds and indicates there is no official fix planned due to potential breaking changes with existing functionality.
I have tested the workarounds mentioned in rtfpessoa/diff2html#381 (comment) and found that the visual issue can be fixed by adding:
.d2h-diff-table {
position: relative;
}
After fixing:
I will create a PR to fix this.