primefaces / primefaces/primereact
Horizontally scrolling in a DataTable with a left frozen column hide the vertical border of the frozen column
Nobody has claimed this yet.
- Dominant language
- CSS
- Stars
- 8.3k
- Forks
- 1.2k
- PR merge metrics
- No merged PRs in 30d
Description
Describe the bug
When you have a frozen column at the left in the DataTable and you scroll horizontally then you see that the vertical border of the frozen column is not visible anymore.
Reproducer
https://stackblitz.com/edit/kss27vxm?file=src%2FApp.jsx
System Information
System:
OS: Linux 5.0 undefined
CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
Memory: 0 Bytes / 0 Bytes
Shell: 1.0 - /bin/jsh
Binaries:
Node: 20.19.1 - /usr/local/bin/node
Yarn: 1.22.19 - /usr/local/bin/yarn
npm: 10.8.2 - /usr/local/bin/npm
pnpm: 8.15.6 - /usr/local/bin/pnpm
npmPackages:
primereact: 10.9.6 => 10.9.6
react: 18.3.1 => 18.3.1
Steps to reproduce the behavior
- start the reproduction
-
scroll horizontally some pixels
-
you see that the vertically border of the first frozen column is gone
Expected behavior
The vertically border should always be visible when scrolling.
(It should be even better to emphasize the border between the frozen column and not a frozen column)
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
Start with the supplied StackBlitz reproducer in src/App.jsx and confirm the frozen-column border disappears after horizontal scrolling. Trace the DataTable styling used by that example, then verify that the left frozen column's vertical border remains visible and distinct after scrolling.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- css, react
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Stale
- Clarity
- Clearly specified
- Newbie friendliness
- 48/100