Anchor positioning
In nautical scenarios, an anchor is used to keep a boat tethered to a certain location, preventing it from moving against the natural flow of the sea. The current of the water might move the boat relative to the anchor a little, but it will always find itself equidistant from the anchor position.
CSS anchor positioning is a new module that provides an equivalent ability for elements on a web page – allowing elements to be connected to other elements, regardless of their structural relationship in the DOM.
If you have been tasked with building any semi-complicated UI on the web, you will have encountered instances where CSS anchor positioning would help. Think about tooltip boxes that pop up next to elements, warnings and information text associated with form fields, drop-down menus that span off navigation items, or even something as routine as positioning something in the corner of another, which ordinarily would necessitate one item being a child...
