Position element relative to page

Question

I have this element, and i want to position it to specific coordinates on the page. The problem is that it's inside another positioned element , so position:absolute places it relatively to this element, while i want it to be placed relatively to the page.

Is there some way i can place an element at specific coordinates on the page?

You can see what i have on this page: http://bit.ly/NkfJk7 when you mouse over that yellow exclamation icon, i want the pink box to appear near that, but instead it appears in double that distance.

Answer 1

I figured it out, i was doing it wrong.

toolTip.style.left = button.offsetLeft + "px";
toolTip.style.top = button.offsetTop + "px";

No need to go absolute :)

Answer 2

You can use position: fixed for this

https://developer.mozilla.org/en/CSS/position

Fixed

Do not leave space for the element. Instead, position it at a specified position relative to the screen's viewport and doesn't move when scrolled. When printing, position it at that fixed position on every page.

---

EDIT: Disregard this answer. Position-fixed positions relative to the screen, so it will follow around it the page scrolls.