Pro Tip #1 : Absolute Positioning is a Good Thing

When we think of “absolute position” in CSS, we sometimes think “arbitrary position.”

An element with position: absolute; is positioned relative to the nearest positioned ancestor (instead of positioned relative to the viewport, like fixed). However; if an absolute positioned element has no positioned ancestors, it uses the document body, and moves along with page scrolling.