Below you can find some Stack Overflow posts around the use and the understanding of
Few hints to consider if you face any issue with
- Check if there is
overflow:hiddendefined somewhere in your code. It will prevent
position:stickyfrom working if applied to an ancestor element.
- Don’t forget to set a value of
bottom/left/right). There is no default direction for sticky so you need to define it.
position:stickyconsider the parent element (containing block) as a reference. Always add border around the element and its parent to understand what’s happening. If both have the same dimension then there is no room for a sticky behavior
- You aren’t obliged to always use
top/bottom/left/right, you can also use different values and even negative ones.