I have an infuriating #CSS question I can't answer.

I have an #HTML table with a sticky . It all works beautifully.

But when the viewport is narrow, there's no horizontal scrolling. I can't find a way to make an overflow-x work while *also* having a sticky header.

Any thoughts?

https://files.mastodon.social/media_attachments/files/114/932/002/270/602/716/original/69598f4834749dbb.mp4

Reply to this note

Please Login to reply.

Discussion

Claude explains it and later suggests a JavaScript workaround:

When you add overflow-x: auto to a container, it creates a new block formatting context. This traps position: sticky elements inside that container - they can only stick within the container's boundaries, not to the viewport.

This is a fundamental CSS limitation