TreeTable: Header's columns not aligned with body's columns in scrollable mode

[FAMSTM]

Describe the bug

In scrollable mode, the header (containing the columns titles) and the body are in 2 separated tables, so the header's columns are not always aligned with the body's columns.

Reproducer

https://codesandbox.io/p/sandbox/primereact-demo-forked-xwsn9c

PrimeReact version

10.1.1

React version

18.x

Language

TypeScript

Build / Runtime

Create React App (CRA)

Browser(s)

Chrome 119

Steps to reproduce the behavior

In the table of the reproducer, scroll on the right side and watch the shift between the titles and the body.

Expected behavior

TreeTable in scrollable mode should have the same structure than in no-scrollable mode, with the titles and body cells in the same table

[kl-nevermore]

primereact/components/lib/treetable/TreeTableScrollableView.js

Line 69 in ad94ff5

scrollHeaderBoxRef.current.style.marginLeft = -1 * scrollBodyRef.current.scrollLeft + 'px';

I used transform instead of marginLeft it worked

  scrollHeaderBoxRef.current.style.transform = `translateX(-${scrollBodyRef.current.scrollLeft}px)`;

[FAMSTM]

The fix in v10.3.0 doesn't solve the problem, there is still a shift between the header's and body's columns

[melloware]

@kl-nevermore lets check if this fix was accidentally reverted as well.

[kl-nevermore]

@melloware
Yes, it was rolled back
https://github.com/primefaces/primereact/blob/b6aee40048e55bf07e7e30fce5b0b52b366a9f6b/components/lib/treetable/TreeTableScrollableView.js#L69C100-L69C100