html - Force "position: absolute" to be relative to the document and not the parent container

Question

I am trying to insert a div into any part of the body and make its position: absolute relative to the whole document and not a parent element which has a position: relative.

Answer 1

You're looking for position: fixed.

From MDN:

Fixed positioning is similar to absolute positioning, with the exception that the element's containing block is the viewport. This is often used to create a floating element that stays in the same position even after scrolling the page.

Notice it doesn't work when...

(...) one of its ancestors has a transform, perspective, or filter property set to something other than none.