css relative vs static code example

Example 1: what are the types of positioning in css

The types of positioning in CSS are-
1)static: this is the default value.
2)sticky: the element is positioned based on the user's scroll position.
3)fixed: the element is positioned related to the browser window.
4)relative: the element is positioned relative to its normal position.
5)absolute: the element is positioned absolutely to its first positioned parent.

Example 2: div element position in screen

function offset(el) {    var rect = el.getBoundingClientRect(),    scrollLeft = window.pageXOffset || document.documentElement.scrollLeft,    scrollTop = window.pageYOffset || document.documentElement.scrollTop;    return { top: rect.top + scrollTop, left: rect.left + scrollLeft }}
// example usevar div = document.querySelector('div');var divOffset = offset(div);console.log(divOffset.left, divOffset.top);