Need an effective way to customize several sticky columns

Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

Summary 💡

If I wish to stick several columns to the left, current solution would be like:

<TableCell style={{ position: 'sticky', left: 0, zIndex: 1 }}>Sticky1</TableCell>
<TableCell style={{ position: 'sticky', left: 100px, zIndex: 1 }}>Sticky2</TableCell>
<TableCell style={{ position: 'sticky', left: 200px, zIndex: 1 }}>Sticky3</TableCell>

However, for columns using relative widths like "10%", it is not a good idea to make their sticky position fixed by some pixels, under difference screen resolutions.

Could there be any way to support this functionality, without specifying fixed distance to the left?

Examples 🌈

I can imagine something like below, yet better design would be expected.

<TableCell sticky="left">Sticky1</TableCell>

Motivation 🔦

No response