react-sticky icon indicating copy to clipboard operation
react-sticky copied to clipboard

Sticky element is mispositioned when StickyContainer is within a position: relative container

Open hepiyellow opened this issue 7 years ago • 1 comments

I'm submitting a ...

  • [x] bug report
  • [ ] feature request
  • [ ] support request

If you're reporting a bug, please provide a minimal demonstration of the problem

Bug Demo

What is the current behavior?

When the <StickyContainer/> has an ancestor with position: relative, the using <Sticky relative/> causes the Sticky element to jump to viewport's top when sticked.

What is the expected or desired behavior?

To stay in <StickyContainer/>.

Why do you want this? What use case do you have?

My Page has an App wrapper (not in my control), and renders my page in a container with position: relative.

What is your environment?

  • Version:
react-sticky
└── 6.0.3
  • Browser: Chrome Version 71.0.3578.9

Is there anything else I should know?

hepiyellow avatar Feb 10 '19 23:02 hepiyellow

Ah I see, yeah that does appear to be a bug. I forked your demo to make it clearer what's happening. https://codesandbox.io/s/wq621mz9j7

vcarl avatar Feb 11 '19 15:02 vcarl