Rendered tables overflow and misalign in preview mode
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 738
- Forks
- 162
- Avg merge
- 6h 2m
- Merged PRs (30d)
- 35
Description
Steps to reproduce
- Create a note with a table
- Add lots of Columns with content
Expected behaviour
The table should truncate, and be scrollable
Actual behaviour
Tablecontent moves outside the viewable space
Screenshots
||Name | Name|Name|Name|Name|Name|Name|Name|
|:---:|:---|:---|:---:|---:|---:|---:|---:|---:|
|1|2| 3 | 4 |5|6|Loooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooong content|8|9|
Tables generally grow only to the right side. For smaller tables that might be fine, but when they grow bigger, they eventually misalign. This looks off, maybe we should always make tables a fixed with or at least center them,
Server
Please complete the following information.
-
Notes app version: 4.6.0
-
Nextcloud version: 25.0.1
-
Browser (incl. version): Firefox 107
-
OS: Kubuntu 22.04
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 in preview mode with the long Markdown table shown in the report, using the reported Notes, Nextcloud, Firefox, and Kubuntu versions where possible. Trace the preview table rendering and styling, then verify that wide tables remain within the viewable area, are horizontally scrollable, and no longer misalign.
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
- 45/100