Chrome에 HTML 요소를 기준으로 위치를 잡을 수 있는 CSS anchor positioning API가 추가되었습니다. 대표적으로 툴팁 같은 경우 HTML 요소를 기준으로 표시되어야 좋고

Chrome에 HTML 요소를 기준으로 위치를 잡을 수 있는 CSS anchor positioning API가 추가되었습니다. 대표적으로 툴팁 같은 경우 HTML 요소를 기준으로 표시되어야 좋고 또 화면의 사이즈에 따라 표시해야할 위치가 달라지기 때문에 계산이 복잡한 편이고 JavaScript를 이용해서 위치를 잡아야 합니다. CSS anchor positioning API를 사용하면 특정 HTML 요소에 anchor-neme: --NAME 처럼 이름을 지정해서 앵커로 지정할 수 있고 다른 요소에서 CSS로 position-anchor로 앞에서 지정한 앵커의 이름을 지정하면 anchor() 함수를 통해 앵커의 위치를 기준으로 위치를 잡을 수 있습니다. 복잡한 케이스는 JavaScript가 필요하겠지만 간단한 위치는 CSS만으로도 잡을 수 있어서 꽤 편해 보입니다. https://developer.chrome.com/blog/anchor-positioning-api?hl=en