Understanding Fixed Positioning
position: fixed
REMOVES the element from the normal flow of the document, and allows you to "pin" one corner using the top/bottom/left/right properties. Where the browser starts to count from the top, bottom, left or right depends on the context box for the fixed
value.
The context box for position: fixed
is always THE VIEWPORT. It is like a sticky note on the viewport. If you fix an element below the fold, you'll need to scroll to see it. However, if an element is above the fold, it will stay in that spot, relative to the viewport, no matter how much scrolling you do.